Skocz do zawartości

[css] menu poziome - nie wyświetla całego


disaster

Recommended Posts

Witam

Poszperałem na forum, przejrzałem google i kursy. Zrobiłem sobie poziome menu i niestety nie wyświetla mi ostatniej pozycji tego menu

kod html

	
<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>

kod css

.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; height:153px;}
.menu_gora .menu_gora_katalog {background:url(img/menu_katalog_fefco.png) no-repeat; width:200px;}
.menu_gora .menu_gora_poradnik {background:url(img/menu_poradnik.png) no-repeat; width:106px;}
.menu_gora .menu_gora_zapytanie {background:url(img/img/menu_zapytanie_ofertowe.png) no-repeat; width:238px;}
.menu_gora li a {width:100%; height:153px; display:block; text-indent:-999px; overflow:hidden;}

Gdzie popełniłem błąd?

W załącznikuwidać, że nie ma ostatniej pozycji, czyli zapytanie_ofertowe

post-351-1295171595,97_thumb.jpg

Link do komentarza
Udostępnij na innych stronach

Już sobie poradziłem, właśnie zrobiłem i wszystko gra. a oto rozwiązanie

html

<div class="menu">
			<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>
</div>

css

div.menu {
	width: 544px;
	height: 153px;
	margin: 0 auto;
	float: right;}

.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;  
	height: 60px;}

.menu_gora .menu_gora_katalog {
	background: url(img/menu_katalog_fefco.png) no-repeat; 
	width: 200px;}

.menu_gora .menu_gora_poradnik {
	background: url(img/menu_poradnik.png) no-repeat; 
	width: 106px;}

.menu_gora .menu_gora_zapytanie {
	background: url(img/menu_zapytanie_ofertowe.png) no-repeat; 
	width: 238px;}

.menu_gora li a {
	width: 100%; 
	height: 60px; 
	display: block; 
	text-indent: -999px;
	overflow: hidden;}

Tak więc jak ktoś będzie sobie robił poziome menu, to można skorzystać z kodu, oczywiście edytując go pod swoje potrzeby :-)

Można zamykać.

Link do komentarza
Udostępnij na innych stronach

Join the conversation

You can post now and register later. If you have an account, sign in now to post with your account.

Gość
Odpowiedz...

×   Wkleiłeś treść z formatowaniem.   Usuń formatowanie

  Only 75 emoji are allowed.

×   Twój link będzie automatycznie osadzony.   Wyświetlać jako link

×   Your previous content has been restored.   Clear editor

×   You cannot paste images directly. Upload or insert images from URL.

Wczytywanie...
×
×
  • Utwórz nowe...