+- Forum Webmastera, HTML, CSS, PHP, MySQL, Hosting, Domeny - Forum dla Webmasterów (https://www.webmastertalk.pl)
+-- Dział: Technologie internetowe - tworzenie stron WWW (https://www.webmastertalk.pl/forum-technologie-internetowe-tworzenie-stron-www)
+--- Dział: xHTML, CSS, JavaScript (https://www.webmastertalk.pl/forum-xhtml-css-javascript)
+--- Wątek: 3 obrazki w div - dlaczego się rozwala? (/thread-3-obrazki-w-div-dlaczego-sie-rozwala)
3 obrazki w div - dlaczego się rozwala? - disaster - 15-01-2011
Dziwny temat, bo nie wiem do końca jak zapytać.
Popatrzcie niżej:
obecny kod jednego z divów
Kod:
<div id="menu_gora">
<a href="......" title="Katalog "><img src="img/katalog.png" alt="Katalog "/></a><a href="......." title="Poradnik"><img src="img/poradnik.png" alt="Poradnik"/></a><a href="........." title="Zapytanie ofertowe"><img src="img/zapytanie_ofertowe.png" alt="Zapytanie ofertowe"/></a>
</div>I teraz jeden kłopot. Jeśli powyższe pola menu są jedno za drugim w kodzie, czyli bez
Kod:
<br />Ale jak chciałem dla czytelności kodu dać tak:
Kod:
<div id="menu_gora">
<a href="......" title="Katalog "><img src="img/katalog.png" alt="Katalog "/></a>
<a href=".........." title="Poradnik"><img src="img/poradnik.png" alt="Poradnik"/></a>
<a href="......." title="Zapytanie ofertowe"><img src="img/zapytanie_ofertowe.png" alt="Zapytanie ofertowe"/></a>
</div>To już górna menu wygląda inaczej, tzn zapytanie_ofertowe schodzi na stronie poniżej katalogu i poradnika. Gdzie robię błąd, bo ja go nie widzę.
RE: 3 obrazki w div - dlaczego się rozwala? - Pedro84 - 15-01-2011
Zarzuć CSSem. Już widzę jeden błąd - poważny. Jeśli to menu, to powinno być zrobione na liście.
RE: 3 obrazki w div - dlaczego się rozwala? - Ancik - 15-01-2011
Witaj,
Znajdź jakiś tutorial, jak powinno się bydowac menu, bo z tego co widzę, nie masz o tym pojęcią i próbujesz to zrobic, bazując na swoim doświadczeniu. Poczytaj trochę najpierw. Jak wspomniał Pedro powyżej, menu powinno byc oparte na liście, nie na linkach w divie. Pozatym bez raczej nie masz szans na powodznie.
Pozdrawiam.
RE: 3 obrazki w div - dlaczego się rozwala? - disaster - 15-01-2011
(15-01-2011, 17:34)Pedro84 napisał(a): Zarzuć CSSem. Już widzę jeden błąd - poważny. Jeśli to menu, to powinno być zrobione na liście.
Kod:
div.menu_gora {
width: 544px;
height: 153px;
float: right;
background: url('img/menu.png');
}(15-01-2011, 17:48)Ancik napisał(a): Witaj,
Znajdź jakiś tutorial, jak powinno się bydowac menu, bo z tego co widzę, nie masz o tym pojęcią i próbujesz to zrobic, bazując na swoim doświadczeniu. Poczytaj trochę najpierw. Jak wspomniał Pedro powyżej, menu powinno byc oparte na liście, nie na linkach w divie. Pozatym bez raczej nie masz szans na powodznie.
Pozdrawiam.
Daj sobie spokój z takim odpowiedziami. Każdy głupi mże napisać: "pocztaj tutorial".
Ja chciałem takiego rozwiązania, więc pytam odnośnie tego co robiłem.
RE: 3 obrazki w div - dlaczego się rozwala? - Kartofelek - 15-01-2011
"Pozatym bez raczej nie masz szans na powodznie." Jak to nie ma na powodzenie? Zrobienie menu na ul to stosowana praktyka, którą można zastosować. Jak zrobisz inaczej, nie urwie ci głowy.
Twoje menu powinno wyglądać tak:
<ul class="menu_gora">
<li class="menu_gora_katalog"><a href="">Katalog</a></li>
<li class="menu_gora_poradnik"><a href="">Poradnik</a></li>
<li class="menu_gora_zapytanie"><a href="">Zapytanie ofertowe</a></li>
</ul>
Reszta to stylowanie.
.menu_gora {list-style-type:none; margin:0; padding:0; float:right; background:url(img/menu.png) no-repeat; width:544px; height:153px;}
.menu_gora li {float:left; width:.....px; height:153px;}
.menu_gora .menu_gora_katalog {background:url(img/katalog.png) no-repeat;}
.menu_gora .menu_gora_poradnik {background:url(img/poradnik.png) no-repeat;}
.menu_gora .menu_gora_zapytanie {background:url(img/img/zapytanie_ofertowe.png) no-repeat;}
.menu_gora li a {width:100%; height:153px; display:block; text-indent:-999px; overflow:hidden;}
Było to już milion razy na tym forum.
RE: 3 obrazki w div - dlaczego się rozwala? - disaster - 15-01-2011
(15-01-2011, 18:10)Kartofelek napisał(a): "Pozatym bez raczej nie masz szans na powodznie." Jak to nie ma na powodzenie? Zrobienie menu na ul to stosowana praktyka, którą można zastosować. Jak zrobisz inaczej, nie urwie ci głowy.
Twoje menu powinno wyglądać tak:
<ul class="menu_gora">
<li class="menu_gora_katalog"><a href="">Katalog</a></li>
<li class="menu_gora_poradnik"><a href="">Poradnik</a></li>
<li class="menu_gora_zapytanie"><a href="">Zapytanie ofertowe</a></li>
</ul>
Reszta to stylowanie.
.menu_gora {list-style-type:none; margin:0; padding:0; float:right; background:url(img/menu.png) no-repeat; width:544px; height:153px;}
.menu_gora li {float:left; width:.....px; height:153px;}
.menu_gora .menu_gora_katalog {background:url(img/katalog.png) no-repeat;}
.menu_gora .menu_gora_poradnik {background:url(img/poradnik.png) no-repeat;}
.menu_gora .menu_gora_zapytanie {background:url(img/img/zapytanie_ofertowe.png) no-repeat;}
.menu_gora li a {width:100%; height:153px; display:block; text-indent:-999px; overflow:hidden;}
Było to już milion razy na tym forum.
Dałeś .menu_gora li jako jedno. A img tego menu mają rózne szer.
RE: 3 obrazki w div - dlaczego się rozwala? - Pedro84 - 15-01-2011
(15-01-2011, 19:06)disaster napisał(a): Dałeś .menu_gora li jako jedno. A img tego menu mają rózne szer.Dodaj sobie klasy i styluj, trochę samodzielności. Ziemniaczek Ci gotowe rozwiązanie podał.
RE: 3 obrazki w div - dlaczego się rozwala? - disaster - 15-01-2011
(15-01-2011, 19:50)Pedro84 napisał(a):(15-01-2011, 19:06)disaster napisał(a): Dałeś .menu_gora li jako jedno. A img tego menu mają rózne szer.Dodaj sobie klasy i styluj, trochę samodzielności. Ziemniaczek Ci gotowe rozwiązanie podał.
Na pewno nie jest to gotowe rozwiązanie pod img menu, które mają różne szerokości
RE: 3 obrazki w div - dlaczego się rozwala? - Pedro84 - 15-01-2011
(15-01-2011, 19:55)disaster napisał(a):Rozumiesz ten kod? Nie zauważyłem, ale tam masz klasy, przenieś tylko szerokość!!(15-01-2011, 19:50)Pedro84 napisał(a):(15-01-2011, 19:06)disaster napisał(a): Dałeś .menu_gora li jako jedno. A img tego menu mają rózne szer.Dodaj sobie klasy i styluj, trochę samodzielności. Ziemniaczek Ci gotowe rozwiązanie podał.
Na pewno nie jest to gotowe rozwiązanie pod img menu, które mają różne szerokości
RE: 3 obrazki w div - dlaczego się rozwala? - disaster - 15-01-2011
(15-01-2011, 20:00)Pedro84 napisał(a):(15-01-2011, 19:55)disaster napisał(a):Rozumiesz ten kod? Nie zauważyłem, ale tam masz klasy, przenieś tylko szerokość!!(15-01-2011, 19:50)Pedro84 napisał(a):(15-01-2011, 19:06)disaster napisał(a): Dałeś .menu_gora li jako jedno. A img tego menu mają rózne szer.Dodaj sobie klasy i styluj, trochę samodzielności. Ziemniaczek Ci gotowe rozwiązanie podał.
Na pewno nie jest to gotowe rozwiązanie pod img menu, które mają różne szerokości
Rozumiem. Przypisać szerokości dla każdej klas menu tak? To po co .menu_gora li {float:left; width:.....px; height:153px;} ???