Go Back   CodingForums.com > :: Client side development > HTML & CSS

Before you post, read our: Rules & Posting Guidelines

Reply
 
Thread Tools Rate Thread
Enjoy an ad free experience by logging in. Not a member yet? Register.
Old 01-09-2009, 09:13 AM   PM User | #1
codie1991
New to the CF scene

 
Join Date: Jan 2009
Posts: 2
Thanks: 2
Thanked 0 Times in 0 Posts
codie1991 is an unknown quantity at this point
Internet Explorer IE bugs with UL

Hi there.

This is the site in question

Having trouble with the way IE6 and 7 render my UL nav.

http://browsershots.org/png/original...cab522302f.png

It appears to put each new item on a new line but still in the correct horizontal position.

This then forces my Welcome message downwards and in IE6 extends the Div.
Code
Code:
<div id="container"><!-- Base of Design -->	
	<div id="header"><!-- Logo and Navigation -->
		<h1>ExigeDesign</h1>		
		<ul>
			<li><a class="selected" href="index.html">Home</a></li>
			<li class="slash">/</li>
			<li><a href="portfolio.html">Porfolio</a></li>
			<li class="slash">/</li>
			<li><a href="contact.html">Contact</a></li>
		</ul>	
	</div><!--End header here-->
CSS

Code:
#header ul {
margin: 0 0 0 470px;
text-align: right;
}

#header ul a,
#header ul .slash {
float: left;
margin-top: 20px;
margin-right: 0px;
padding-right: 3px;
font-family: Georgia;
font-size: 18px;
font-weight: normal;
text-decoration: none;
font-style: italic;
letter-spacing: 0.7px;
color: #ebebeb;
}

#header ul a:hover {
color: #ed008c;
}

#header ul a.selected:hover {
text-decoration: underline;
}

#header ul a.selected {
color: #ed008c;
}
Any Help would be greatly appreciated for this budding coder and im sure its just a matter of adding a little CSS to the UL

Last edited by codie1991; 01-09-2009 at 09:42 AM..
codie1991 is offline   Reply With Quote
Old 01-09-2009, 09:30 AM   PM User | #2
ktsixit
Regular Coder

 
Join Date: Sep 2008
Posts: 106
Thanks: 27
Thanked 3 Times in 3 Posts
ktsixit is an unknown quantity at this point
try putting your list inside a div and set a height for this div. Also add display:inline in your list items css.

<div style="height:20px;">
<ul>
<li style="display:inline;">....</li>
<li style="display:inline;">....</li>
<li style="display:inline;">....</li>
</ul>
</div>

I think that this will work for you
ktsixit is offline   Reply With Quote
Users who have thanked ktsixit for this post:
codie1991 (01-09-2009)
Old 01-09-2009, 09:31 AM   PM User | #3
abduraooft
Supreme Master coder!

 
abduraooft's Avatar
 
Join Date: Mar 2007
Location: N/A
Posts: 14,680
Thanks: 158
Thanked 2,182 Times in 2,169 Posts
abduraooft is just really niceabduraooft is just really niceabduraooft is just really niceabduraooft is just really niceabduraooft is just really nice
Just add
Code:
#header ul li{
display:inline;
}
into your CSS.

PS: welcome to CF!
__________________
Quote:
The Dream is not what you see in sleep; Dream is the thing which doesn't let you sleep. --(Dr. APJ. Abdul Kalam)
abduraooft is offline   Reply With Quote
Users who have thanked abduraooft for this post:
codie1991 (01-09-2009)
Old 01-09-2009, 09:53 AM   PM User | #4
codie1991
New to the CF scene

 
Join Date: Jan 2009
Posts: 2
Thanks: 2
Thanked 0 Times in 0 Posts
codie1991 is an unknown quantity at this point
Thank you both, will try that and see if it works. Need to wait for BrowserShots.org now to find out.
codie1991 is offline   Reply With Quote
Old 01-09-2009, 10:27 AM   PM User | #5
abduraooft
Supreme Master coder!

 
abduraooft's Avatar
 
Join Date: Mar 2007
Location: N/A
Posts: 14,680
Thanks: 158
Thanked 2,182 Times in 2,169 Posts
abduraooft is just really niceabduraooft is just really niceabduraooft is just really niceabduraooft is just really niceabduraooft is just really nice
Quote:
Originally Posted by codie1991 View Post
Thank you both, will try that and see if it works. Need to wait for BrowserShots.org now to find out.
Make use of IE Tester
__________________
Quote:
The Dream is not what you see in sleep; Dream is the thing which doesn't let you sleep. --(Dr. APJ. Abdul Kalam)
abduraooft is offline   Reply With Quote
Reply

Bookmarks

Tags
<ul>, bug, debugging, ie6, nav

Jump To Top of Thread


Thread Tools
Rate This Thread
Rate This Thread:

Posting Rules
You may not post new threads
You may not post replies
You may not post attachments
You may not edit your posts

BB code is On
Smilies are On
[IMG] code is On
HTML code is Off

Forum Jump


All times are GMT +1. The time now is 08:27 PM.


Advertisement
Log in to turn off these ads.