Velocity Reviews - Computer Hardware Reviews

Velocity Reviews > Newsgroups > Programming > HTML > <ul> formatting problem Mozilla

Reply
Thread Tools

<ul> formatting problem Mozilla

 
 
Paul Furman
Guest
Posts: n/a
 
      02-25-2004
Mozilla 1.4 pushes the nav list over with a large false left padding of
some sort:
http://www.edgehill.net/html/css/nav.htm

Any idea what's going on? It works fine in IE6. I've simplified this to
try and track the problem. I boxed the nav menu so you can see how it's
out of whack.

source:


<html>
<head>
<style>
.left {
float: left;
padding-right: 1em;
}
ul.menu-left {
border: 1px solid #444;
list-style: none;
width: 1em;
}
li.menu-left {
margin-top: 1em;

}
li.menu-first-left {
}
li.menu-last-left {
margin-top: 1em;
}
</style>
</head>
<body>
<center>
<table class=".constrained">
<tr>
<td class=".constrained">
<div class="left">
<ul class="menu-left">
<li class="menu-first-left"><a href="index.php" >home</a></li>

<li class="menu-left"><a href="ecards.php" >ecards</a></li>
<li class="menu-last-left"><a href="class-links.php">class
links</a></li>
</ul>
</div>
Photo Galleries:
<p>
pictures<br>
travel<br>
nature<br>

</center>
</td>
</tr>
</table>
</body>
</html>

 
Reply With Quote
 
 
 
 
Els
Guest
Posts: n/a
 
      02-25-2004
Paul Furman wrote:

> Mozilla 1.4 pushes the nav list over with a large false left padding of
> some sort:
> http://www.edgehill.net/html/css/nav.htm
>
> Any idea what's going on? It works fine in IE6. I've simplified this to
> try and track the problem. I boxed the nav menu so you can see how it's
> out of whack.
>
> source:
>
> <html>
> <head>
> <style>
> .left {
> float: left;
> padding-right: 1em;
> }
> ul.menu-left {
> border: 1px solid #444;
> list-style: none;
> width: 1em;


width: 1em?
haven't copy-pasted it, but could that have to do with it?

[snip rest of code]

--
Els

Sonhos vem. Sonhos vo. O resto imperfeito.
- Renato Russo -

 
Reply With Quote
 
 
 
 
Paul Furman
Guest
Posts: n/a
 
      02-25-2004
Els wrote:
>>
>> source:
>>
>> <html>
>> <head>
>> <style>
>> .left {
>> float: left;
>> padding-right: 1em;
>> }
>> ul.menu-left {
>> border: 1px solid #444;
>> list-style: none;
>> width: 1em;

>
>
> width: 1em?
> haven't copy-pasted it, but could that have to do with it?


I just did that to emphasize the problem. If I set it to 4 ems or
whatever then it fits inside but still has this crazy left margin
problem. The box resizes somewhat to hold the menu text. In fact, I can
set the width to "0" and it still gives about 3-4 ems with the contents
outside that.

 
Reply With Quote
 
Paul Furman
Guest
Posts: n/a
 
      02-25-2004


Paul Furman wrote:

> Els wrote:


>>
>> width: 1em?
>> haven't copy-pasted it, but could that have to do with it?

>
>
> I just did that to emphasize the problem. If I set it to 4 ems or
> whatever then it fits inside but still has this crazy left margin
> problem. The box resizes somewhat to hold the menu text. In fact, I can
> set the width to "0" and it still gives about 3-4 ems with the contents
> outside that.


IE also moves the list in from the left edge of the page about 4em

 
Reply With Quote
 
kchayka
Guest
Posts: n/a
 
      02-25-2004
Paul Furman wrote:

> Mozilla 1.4 pushes the nav list over with a large false left padding of
> some sort:
> http://www.edgehill.net/html/css/nav.htm


Both ul and li elements have either a default left margin and/or
padding, depending on the browser.

If you don't want the default values applied, set both margin-left and
padding-left to 0. Adjust to taste.

--
Reply address is a bottomless spam bucket.
Please reply to the group so everyone can share.
 
Reply With Quote
 
Paul Furman
Guest
Posts: n/a
 
      02-25-2004
kchayka wrote:

> Paul Furman wrote:
>
>
>>Mozilla 1.4 pushes the nav list over with a large false left padding of
>>some sort:
>>http://www.edgehill.net/html/css/nav.htm

>
>
> Both ul and li elements have either a default left margin and/or
> padding, depending on the browser.
>
> If you don't want the default values applied, set both margin-left and
> padding-left to 0. Adjust to taste.



I tried

margin-left 0;
padding-left 0;

on everything.


The url above now shows a paragraph of text wrapping around the menu (if
the window is small) which does not have this big left margin.

 
Reply With Quote
 
Sieue
Guest
Posts: n/a
 
      02-25-2004
Paul Furman wrote:
> Mozilla 1.4 pushes the nav list over with a large false left padding
> of some sort:
> http://www.edgehill.net/html/css/nav.htm
>


Its not that mad. Unordered lists are supposed to be indented and Mozilla
renders them properly. You can set margins so they don't indent though.

--
Sue



 
Reply With Quote
 
Toby A Inkster
Guest
Posts: n/a
 
      02-25-2004
Paul Furman wrote:

> I tried
> margin-left 0;
> padding-left 0;
> on everything.


Did you try it with colons?

Aside: Instructions for fueling a coal fire...

if d B mt put :
if d B .

Translation:

If the grate be empty, put coal on.
If the grate be full, stop.

--
Toby A Inkster BSc (Hons) ARCS
Contact Me - http://www.goddamn.co.uk/tobyink/?page=132

 
Reply With Quote
 
Paul Furman
Guest
Posts: n/a
 
      02-25-2004
kchayka wrote:

> Paul Furman wrote:
>
>
>>Mozilla 1.4 pushes the nav list over with a large false left padding of
>>some sort:
>>http://www.edgehill.net/html/css/nav.htm

>
>
> Both ul and li elements have either a default left margin and/or
> padding, depending on the browser.
>
> If you don't want the default values applied, set both margin-left and
> padding-left to 0. Adjust to taste.



Thanks, I must have done something wrong, looks like it's only needed
for the <ul>

ul.menu-left {
border: 1px solid #444;
list-style: none;
width: 9em;
margin-left: 0;
padding-left: 0;
}

 
Reply With Quote
 
Els
Guest
Posts: n/a
 
      02-25-2004
Paul Furman wrote:

> kchayka wrote:
>
>> Paul Furman wrote:
>>
>>> Mozilla 1.4 pushes the nav list over with a large false left padding
>>> of some sort:
>>> http://www.edgehill.net/html/css/nav.htm

>>
>> Both ul and li elements have either a default left margin and/or
>> padding, depending on the browser.
>>
>> If you don't want the default values applied, set both margin-left and
>> padding-left to 0. Adjust to taste.

>
> Thanks, I must have done something wrong, looks like it's only needed
> for the <ul>
>
> ul.menu-left {
> border: 1px solid #444;
> list-style: none;
> width: 9em;
> margin-left: 0;
> padding-left: 0;
> }


Just a hint:
When you need to know where spaces come from, write at the
top of the stylesheet
*{border:1px solid red; margin:0; padding:0;}

See what it looks like then, and see what difference it
makes when you take padding:0 away, and then check what
happens when you take margin:0 away.

Usually works for me

--
Els

Sonhos vem. Sonhos vo. O resto imperfeito.
- Renato Russo -

 
Reply With Quote
 
 
 
Reply

Thread Tools

Posting Rules
You may not post new threads
You may not post replies
You may not post attachments
You may not edit your posts

BB code is On
Smilies are On
[IMG] code is On
HTML code is Off
Trackbacks are On
Pingbacks are On
Refbacks are Off


Similar Threads
Thread Thread Starter Forum Replies Last Post
Re: Mozilla's Compose Formatting Toolbar Mozilla Champion (Dan) Firefox 2 08-09-2006 03:53 AM
XML formatting in Mozilla Firefox mic123@gmail.com XML 5 06-14-2006 12:55 PM
My CUSTOM Versions Of Mozilla Fiorefox & Mozilla Thunderbird Norvin Adams III Firefox 6 07-13-2004 03:26 PM
Need formatting options menu for formatting hard drive Mark T. Computer Support 3 11-24-2003 11:50 PM
mozilla 1.5 from mozilla 1.4 Disco Firefox 6 11-07-2003 04:34 PM



Advertisments