Side
Side

Reputation: 95

IE6 double padding and margin bug

I was looking around the net and nothing works.

I have a box with an unorderd list and ie6 makes the padding and margin double size

.block {
    width: 236px;
    float: left;
    border: 1px solid #cecece;
    background: url(images/list_bg.png) repeat-y;

}

.block li {
        width: 237px;
        height: 74px;
        background: url(images/arrow.png) no-repeat 0px 13px, url(images/bottom.png) left bottom no-repeat;
        margin-left: 30px;
        padding: 0px 20px;
        list-style: none;
        line-height: 36px;

    } 

if i add display inline it breaks, what do im doing wrong?

Upvotes: 0

Views: 1517

Answers (2)

ShibinRagh
ShibinRagh

Reputation: 6646

some times ie6 will take double margin , Read http://www.positioniseverything.net/explorer/doubled-margin.html

we can manage this issue with ie hack code ie6 _ , ie >

.class {_margin-left: 30px;}

.class {>margin-left: 30px;}

Upvotes: 0

James South
James South

Reputation: 10635

Your box is narrower than the list item inside of it.

You should have a look at the Box Model

box model

Upvotes: 3

Related Questions