ul li issues with IE

**milkandhoney** · Jul 26, 2012 19:05

Hello,

Another issue I am having with ul li and IE.

I have an unordered list with a bullet point. All looks fine in Chrome and Firefox, but in IE the bullets have a left indent that is not supposed to be there and there is no gap between the bullet and the text.

Code:

HTML Code:

}
.content ul {
	list-style-type: none;
	margin: 0px;
	padding: 0px;
}
.content ul li {
	margin-right: 0px;
	margin-top: 0px;
	margin-bottom: 4px;
	list-style-image: url(../images/bullet.gif);
	padding: 0px;
	list-style-position: inside;
}

**ralph.m** · Jul 26, 2012 19:08

Each browser sets its own defaults, so unless you override them, they still apply. You can easily get rid of all defaults with something like this:

Code:

ul, li {margin: 0; padding: 0;}

**milkandhoney** · Jul 26, 2012 19:55

Originally Posted by ralph.m

Each browser sets its own defaults, so unless you override them, they still apply. You can easily get rid of all defaults with something like this:

Code:

ul, li {margin: 0; padding: 0;}

Hello ralph.m

I did that. You gave me the CSS reset a couple of days ago that I have applied.

**ralph.m** · Jul 26, 2012 20:52

Originally Posted by milkandhoney

I did that. You gave me the CSS reset a couple of days ago that I have applied.

Ah, right, I should have looked at your code more closely. We'd really need to see a live link to get a sense of what's happening here.

**milkandhoney** · Jul 26, 2012 21:21

Originally Posted by ralph.m

Ah, right, I should have looked at your code more closely. We'd really need to see a live link to get a sense of what's happening here.

Yeah, I realise that I am limiting myself with getting help from you guys by not having a live site. This is a website for the company I am working, it is not live yet, and not to be uploaded/launched until it is all ready.
I have found a way around this. I have removed the bullet points, the actual bullet image and the list is rendered OK on IE and have just manually inserted a dash....

**ralph.m** · Jul 26, 2012 21:25

Hm, an alternative is to make up a test page that includes the error and post it here. All you need is the relevant CSS and HTML—but make sure to test the sample first to ensure that it demostrates the problem. E.g. post your code here like this:

Code:

<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="utf-8">
<title>Test Page</title>
	
<style media="all">
relevant styles here
</style>
	
</head>
<body>

relevant HTML here

</body>

</html>

User Tag List

Thread: ul li issues with IE

Thread Tools

Display

ul li issues with IE

Bookmarks

Bookmarks

Posting Permissions