2 replies [Last post]
LordVader
Offline
Regular
Last seen: 12 years 37 weeks ago
Joined: 2005-09-14
Posts: 24
Points: 0

Hi,

I have the following page:

Test

.box {
color:blue;
background-color:yellow;
border-width:1px;
border-style:solid;
border-color:red;
width:250px;
}
ul {
list-style-type:none;
margin-top:0;
}
.head {
display:block;
position:relative;
text-decoration:none;
border-bottom-width:3px;
border-bottom-style:solid;
border-bottom-color:red;
color:blue;
background-color:yellow;
width:250px;
font-weight:bold;
font-size:14pt;
}
.sub {
display:block;
text-decoration:none;
color:red;
background-color:yellow;
font-weight:bold;
font-size:10pt;
margin-top:1px;
width:170px;
padding-right:0px;
}

  • Another Test
    • Another Test
    • Another Test
    • Another Test
    • Another Test

In IE6 I cannot get the border at the bottom of the first list to go all the way across the containing box, there is a gap at the left-hand side. What is causing this, in IE7 it is fine??

LordVader
Offline
Regular
Last seen: 12 years 37 weeks ago
Joined: 2005-09-14
Posts: 24
Points: 0

Not sure why a lot of the

Not sure why a lot of the HTML code was missing from the code block in my first post...For reference, I'm using the HTML 4.01 strict DTD

Any help appreciated

Tyssen
Tyssen's picture
Offline
Moderator
Brisbane
Last seen: 6 years 36 weeks ago
Brisbane
Timezone: GMT+10
Joined: 2004-05-01
Posts: 8201
Points: 1386

LordVader wrote:Not sure why

LordVader wrote:
Not sure why a lot of the HTML code was missing from the code block in my first post

Because you used the wrong code tag. It should be <code>.
For your problem, lists have default left margin/padding. You have to set it to 0 to remove the space.

How to get help
Post a link. If you can't post a link, jsFiddle it.
My blog | My older articles | CSS Reference