[CSS] Menu poziome - odstepy

0

Jak zrobic odstepy pomiedzy kolejnym kawalkami menu, tak aby kazde mialo ta sama szerokosc (ustalona poparzez width:120px)?

[ NAPIS ] <-odstep-> [ NAPIS ] <-odstep-> [ NAPIS ]

To co mam, dziala z float, jednak wtedy nie ma odstepu. Jak sie to tego zabrac ?

style.css



#nav {
	display: inline;
	padding: 0px 0 0 5px;
	float: left;
	height: 50px;
	width: 800px;
	font-family: Verdana;
	font-size: 17px;
}

#nav ul {
	list-style: none;
	padding: 0;
	margin-left: 100;
      margin-right: 10;
   	margin-top: 0;
   	margin-bottom: 0;
}

#nav li {
	display: inline;
	list-style: none;
	border: 4px solid #aaa755;
	margin: 0;
	padding: 15px 15px 19px 15px;
      height: 50px;
	width: 300px;
	margin-left: 100;
      margin-right: 10;
   	margin-top: 0;
   	margin-bottom: 0;
}




<?xml-stylesheet type="text/css" href="style.css" ?>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.1//EN" "http://www.w3.org/TR/xhtml11/DTD/xhtml11-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" lang="en" xml:lang="en">
<head>
<title>Urhhhh</title>
<style type="text/css">	@import url(style.css);</style>
</head>

<body>
		
		<div id="nav">
			
	
			
			<ul>
				<li>aaaaA</li>
				<li>aaaaA</li>
				<li>aaaaAaaaaaa</li>
				<li>aaaaA</li>
				<li>aaaaA</li>

			</ul>



		</div>

</body>
</html>
0

Chodzi ci o to, aby każde li miały 120 pikseli, czy żeby odstęp między nimi miał 120px? Bo nie mogę zrozumieć.

I w tym kodzie CSS co podałeś to nie masz jednostek przy kilku właściwościach margin-left i margin-right - brak jednostki jest dozwolony tylko przy zerze (bo nieważne czy 0 pikseli, czy 0 centymetrów czy 0 milionów kilometrów - choć takiej jednostki akurat w CSS nie ma ;))

0

Chodzi mi o jedno i drugie (chcialbym aby odstepy byly na 20px a dlugosc li 120px)

Brak jednostek wynika z desperacji (wstawialem juz co popadnie).

0

Zrobiłem coś takiego i to jest chyba to, o co ci chodzi.

#nav {
        padding: 0 0 0 5px;
        font-family: Verdana;
        font-size: 17px;
}

#nav ul {
        list-style-type: none;
        padding: 0;
        margin-top: 0;
        margin-bottom: 0;
        width: 100%;
}

#nav li {
        display: block;
        border: 4px solid #aaa755;
        margin: 0;
        padding: 15px 15px 19px 15px;
        margin-left: 20px;
        width: 90px;
        float: left;
}

Gdy IE (7 beta 2) działa w trybie standardów (czytaj: nie ma linijki <?xml-stylesheet type="text/css" href="style.css" ?> PRZED Doctype), to wygląda tak samo jak na Firefoksie. Żeby pierwszy element Li nie miał marginesu od lewej przydałoby się dodać do CSS regułę:

#nav li:first-child {
       margin-left: 0;
}

ale to nie zadziala pod IE 6. I starszymi.

0

Doskonale! O to chodzilo.

Wielkie podziekowania !

1 użytkowników online, w tym zalogowanych: 0, gości: 1