Forums

telepati

I tried many ways but I cant my nav exactly where I want. I didnt space between Navs. When I try width properties on CSS my last 2 navs jump to line. I add text-indent property thats helped me. But this time come up to Browser problem on PC. Im using iMac. Safari and Firefox( for Mac) good preview but PC IE8 and Firefox terrible. How can I fixed that problem. I attached my all files I need your help?

HTML


<body>

<div id=\"container\">

	<ul id=\"nav\">
	
		<li><a href=\"#\">ANASAYFA</a></li>
		<li><a href=\"#\">HAKKIMIZDA</a></li>
		<li><a href=\"#\">H?ZMETLER</a></li>
		<li><a href=\"#\">EK?B?M?Z</a></li>
		<li><a href=\"#\">DUYURULAR</a></li>
		<li><a href=\"#\">MAKALELER</a></li>
		<li><a href=\"#\">?LET???M</a></li>
	
	</ul>

<div id=\"main-content\">
	<h2>HAKKIMIZDA</h2>
	
	<p>
	Özel Çocuk Dan??manl?k, Rehberlik ve Uygulama Merkezi 1993 y?l?nda pedagog  Ülker Ya?in
	taraf?ndan kuruldu. Kurulu?un amac?; uzun y?llar?n deneyiminin aktar?l?p payla??lmas?,
	mesleki çal??malar?n uygun ortamda yap?lmas?, geli?en dünyan?n alan?m?za katk?lar?n?n
	izlenmesi ve uygulanmas?n?n sa?lanmas? idi. Erken e?itimin, e?itim koordinasyonunun ve
	planlamas?n?n, bireysel yakla??m?n öneminin y?llard?r yap?lan çal??malarla görülmesi
	kurulu?umuzun çal??ma alanlar?n? belirledi. Bugüne kadar yapt???m?z çal??malar?n
	sonuçlar?n? halen izlemeye devam etti?imiz pek çok çocu?un geli?imiyle görmekteyiz.
	</p>
	
	<p>Kadromuzu, alanlar?nda deneyimli uzman arkada?lar?m?z olu?turmaktad?r. Kurumumuzda ekip
	çal??mas?na çok önem verilmekte, ebeveyn e?itimi, bireysel ve grup e?itimleri, e?itici
	seminerler yap?lmaktad?r.
	</p>
	
</div>

<div id=\"footer\">
	<a href=\"#\"<img src=\"images/mailbox.jpg\"/></a>
</div>

</div>

</body>

CSS


*{
	margin: 0;
	padding: 0;
}

body {
	font: 62.5% Helvetica, Arial, san-serif;
	background: url(images/bg.jpg);
}

#container {
	width: 780px;
	margin: 0 auto;
}

#logo {
	margin-top: 50px;
}

ul#nav {
	height: 125px; 
	background: url(images/header.jpg) no-repeat;
	list-style: none;
	padding-left:259px;
}

p, li {
	font-size: 11px;
	line-height: 1.3em;
	margin-bottom: 0.8em;
	font-weight: bold;
	color: #003300;
	text-align: justify;
}

h2{
	font-size: 13px; 
	margin-bottom: 0.8em;
	color: #003300;
}

ul#nav li a {
	display: block;
	float: left;
	margin-top: 73px;
	color: #003300;
	font-weight: bold;
	text-decoration: none;
	text-indent: 11px;
	
}

ul#nav li a:hover, ul#nav li a:active {
	color: #cc0033;
}

#main-content{
	background: url(images/bgpuzzle.jpg);
	padding: 50px 50px 250px 50px;
		
}

#footer {
	background: url(images/footerbg.jpg);
	height: 16px;
	padding: 4px 6px 4px 0;
	text-align: right;

}

Safari
http://i39.tinypic.com/wwgsw7.png
Firefox (on Mac)
http://i44.tinypic.com/10xa7gw.png
IE 8
http://i43.tinypic.com/2dkwxg4.jpg
Firefox (on PC)
http://i44.tinypic.com/161c0fq.jpg
This is the adding width 70px(ul#nav li a) and padding left 275px(ul#nav).

TheDoc

What are you trying to do?

telepati

Did you see safari and firefox(Mac preview) all navigation links right place between borders. But IE and Firefox (PC preview) not. Why did happend How can I fix that?

TheDoc

Ooooohhhh, I see it now.

Posting a link to the site would be a much better help. You're simply going to want to do something like this, in its most basic form:

ul {
width: width of nav;
}

ul li {
width: width of tab;
text-align: center;
}

telepati

I dint publish yet this only one page. I will try your way but could you please check this page I attached files bottom my first message. By the way thank you for attention.

treehouse : what would you like to learn today?

Forums

CSS nav position problem?