CODEWITHSUNDEEP
cssinternet-explorer-8
ryudice
ryudice

Reputation: 37456

LI element in Internet Explorer 8

for some reason my LI elements are not floated to the left in internet explorer, they are showed each below the other. Anybody knows how I could fix this?

#books ul{
    list-style:none;
    margin:0px;
    float:left;
    display:inline;
}
#books ul li{
    float:left;
    margin-right: 20px;
    padding-bottom: 20px;
    height:300px;
    display:inline;
}

Upvotes: 3

Views: 7038

Answers (2)

llanato
llanato

Reputation: 2503

There is no need to use float, if you just want each LI to be inline you can use just the display property.

#books ul{
    width: 100%;
    list-style: none;
    margin: 0px;
}
#books ul li{
    margin-right: 20px;
    padding-bottom: 20px;
    height: 300px;
    display: inline-block;
}

Upvotes: 0

PortageMonkey
PortageMonkey

Reputation: 2725

If I understand your issue correctly, it may have to do with setting display: inline. Changing to display:block; seems to solve the issue in IE and FF.

#books ul{
list-style:none;
margin:0px;
float:left;
display:block;}

#books ul li{ float:left; margin-right: 20px; padding-bottom: 20px; height:300px; display:block;}

Upvotes: 4

Related Questions