2 replies [Last post]
ShinyCDMan
Offline
newbie
Last seen: 17 years 17 weeks ago
Joined: 2004-10-05
Posts: 2
Points: 0

I am using the following code to display a list beneath a horizontal rule:

<hr></hr>
<ul>
<li>...</li>
</ul>

I want there to be a one line gap between the horizontal rule and the list. Although this displays correctly in Mozilla, when using IE the gap between the horizontal rule and the list is huge.

Can anyone recommend a way of getting this to display properly in both browsers?

Thanks,
Shiny

TimeBandit
Offline
Enthusiast
Maryland, USA
Last seen: 17 years 21 weeks ago
Maryland, USA
Joined: 2004-09-02
Posts: 112
Points: 0

Re: Positioning Lists in IE/Mozilla

This really kinda depends on how things are setup. I persnally default all elements to margin:0 so i won't have to keep doing it over and over, but i don't think most people do that so you'll probabaly want to set the Hr and the UL to margin:0 so you can get rid of browser defaults.

<hr class="gimmeRoom">
<ul class="list1">
<li>stuff</li>
</ul>

.list1 {
margin: 0px;
padding: 0px;
}
.gimmeRoom {
margin: 0 0 11px 0;
padding: 0px;
}

ShinyCDMan
Offline
newbie
Last seen: 17 years 17 weeks ago
Joined: 2004-10-05
Posts: 2
Points: 0

Re: Positioning Lists in IE/Mozilla

TimeBandit wrote:
This really kinda depends on how things are setup. I persnally default all elements to margin:0 so i won't have to keep doing it over and over, but i don't think most people do that so you'll probabaly want to set the Hr and the UL to margin:0 so you can get rid of browser defaults.

<hr class="gimmeRoom">
<ul class="list1">
<li>stuff</li>
</ul>

.list1 {
margin: 0px;
padding: 0px;
}
.gimmeRoom {
margin: 0 0 11px 0;
padding: 0px;
}

Thanks!