By using this site, you agree to our updated Privacy Policy and our Terms of Use. Manage your Cookies Settings.
438,396 Members | 1,869 Online
Bytes IT Community
+ Ask a Question
Need help? Post your question and get tips & solutions from a community of 438,396 IT Pros & Developers. It's quick & easy.

Left margin/padding for lists

P: n/a
What is *supposed* to be the way to specify the horizontal offset of (a) the
list item's marker and (b) the list item's content? In particular, see

http://mywebpages.comcast.net/hmessinger/default.html

which validates under Strict. Under IE6, Opera, and Firebird, the markers
are indented as one would expect the default to be. What if I want them
moved over to the left edge of the list? On the above page, there is no
margin-left for either UL or LI.

Variations:

http://mywebpages.comcast.net/hmessinger/default2.html

UL { margin-left: 2em }

IE6: bullets move to the left
Opera: bullets move to the left
Firebird: bullets move to the right

http://mywebpages.comcast.net/hmessinger/default3.html

LI { margin-left: 2em }

IE6: bullets move to the right
Opera: bullets move to the right
Firebird: same placement as for default2.html.

http://mywebpages.comcast.net/hmessinger/default4.html

UL { margin-left: -2em }

IE6: bullets move *way* to the left (even the text is clipped on the left)
Opera: same as IE6
Firebird: bullets move to the left by the same amount as
they did for IE6 and Opera under default2.html

http://mywebpages.comcast.net/hmessinger/default5.html

LI { margin-left: -2em }

IE6: same placement as under default2.html.
Opera: same placement as under default2.html.
Firebird: same placement as for default4.html.

Curious. I could have gone on to try margin-left: 0 and various padding-left
permutations, but I thought I'd come ask you folks.

--
Harlan Messinger
Remove the first dot from my e-mail address.
Veuillez ôter le premier point de mon adresse de courriel.

Jul 20 '05 #1
Share this Question
Share on Google+
4 Replies


P: n/a
In article Harlan Messinger wrote:
What is *supposed* to be the way to specify the horizontal offset of (a) the
list item's marker and (b) the list item's content? In particular, see
Display:marker etc. by CSS2 spec.
http://mywebpages.comcast.net/hmessinger/default.html

which validates under Strict. Under IE6, Opera, and Firebird, the markers
are indented as one would expect the default to be. What if I want them
moved over to the left edge of the list? On the above page, there is no
margin-left for either UL or LI.
[test cases to show known differency between mozilla and Opera/IE. Opera
and IE draw bullet to margin, mozilla to padding of ul/ol. IIRC]
Curious. I could have gone on to try margin-left: 0 and various padding-left
permutations, but I thought I'd come ask you folks.


As the CSS1 list model don't specify much about this, every browser has
done what it thinks is best. Opera and IE are IIRC same, Mozilla
different. Both behaviour is correct.

To change list style, always specify both padding-left and margin-left
for both ul/ol and li in order to get somewhat consistant results.

IMHO, none of the ways to display list is perfect, including
display:marker related stuff...
--
Lauri Raittila <http://www.iki.fi/lr> <http://www.iki.fi/zwak/fonts>
Saapi lähettää meiliä, jos aihe ei liity ryhmään, tai on yksityinen
tjsp., mutta älä lähetä samaa viestiä meilitse ja ryhmään.

Jul 20 '05 #2

P: n/a
Lauri Raittila wrote:
In article Harlan Messinger wrote:
What is *supposed* to be the way to specify the horizontal offset
of (a) the list item's marker and (b) the list item's content?


[test cases to show known differency between mozilla and Opera/IE.
Opera and IE draw bullet to margin, mozilla to padding of ul/ol.
IIRC]

As the CSS1 list model don't specify much about this, every browser
has done what it thinks is best. Opera and IE are IIRC same,
Mozilla different. Both behaviour is correct.


For the op, here's a page describing the different approaches:

http://devedge.netscape.com/viewsour...2/list-indent/

--
Brian
follow the directions in my address to email me

Jul 20 '05 #3

P: n/a

"Lauri Raittila" <la***@raittila.cjb.net> wrote in message
news:MP***********************@news.cis.dfn.de...
In article Harlan Messinger wrote:
What is *supposed* to be the way to specify the horizontal offset of (a) the list item's marker and (b) the list item's content? In particular, see
Display:marker etc. by CSS2 spec.
http://mywebpages.comcast.net/hmessinger/default.html

which validates under Strict. Under IE6, Opera, and Firebird, the markers are indented as one would expect the default to be. What if I want them
moved over to the left edge of the list? On the above page, there is no
margin-left for either UL or LI.


[test cases to show known differency between mozilla and Opera/IE. Opera
and IE draw bullet to margin, mozilla to padding of ul/ol. IIRC]
Curious. I could have gone on to try margin-left: 0 and various padding-left permutations, but I thought I'd come ask you folks.


As the CSS1 list model don't specify much about this,


A most unfortunate oversight. (Unless, of course, it was intentional, but I
can' t imagine what good would have been expected to come from it!)
every browser has
done what it thinks is best. Opera and IE are IIRC same, Mozilla
different. Both behaviour is correct.

To change list style, always specify both padding-left and margin-left
for both ul/ol and li in order to get somewhat consistant results.

IMHO, none of the ways to display list is perfect, including
display:marker related stuff...


Thanks.

Jul 20 '05 #4

P: n/a

"Brian" <us*****@julietremblay.com.invalid-remove-this-part> wrote in
message news:wBkLb.57$na.329@attbi_s04...
Lauri Raittila wrote:
In article Harlan Messinger wrote:
What is *supposed* to be the way to specify the horizontal offset
of (a) the list item's marker and (b) the list item's content?


[test cases to show known differency between mozilla and Opera/IE.
Opera and IE draw bullet to margin, mozilla to padding of ul/ol.
IIRC]

As the CSS1 list model don't specify much about this, every browser
has done what it thinks is best. Opera and IE are IIRC same,
Mozilla different. Both behaviour is correct.


For the op, here's a page describing the different approaches:

http://devedge.netscape.com/viewsour...2/list-indent/


Thanks!

Jul 20 '05 #5

This discussion thread is closed

Replies have been disabled for this discussion.