Closed Bug 227937 Opened 21 years ago Closed 20 years ago

margins not calculated on ul within table within div

Categories

(Core :: CSS Parsing and Computation, defect)

x86
Windows 98
defect
Not set
normal

Tracking

()

RESOLVED DUPLICATE of bug 27851

People

(Reporter: ve3ll, Assigned: dbaron)

References

()

Details

User-Agent: Mozilla/5.0 (Windows; U; Win98; en-US; rv:1.6b) Gecko/20031208 Build Identifier: Mozilla/5.0 (Windows; U; Win98; en-US; rv:1.6b) Gecko/20031208 the list items for each suggested text are aligned incorrectly causing wrap when none is needed. Check the offset against opera and msie. it appears that auto margin on table and td are not including the fixed margin in ul when it computes length required by content. thus the table margin offset is too far to right when it renders its box ;-[ ;-[ ;-[ just looking at inconsistancies between browsers which frustrate designers greatly. <<test code follows>> <?xml version="1.0"?> <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> <html xmlns="http://www.w3.org/1999/xhtml"> <head><title>Class Schedule</title> <style type="text/css"> body {margin:40px; margin-top:0px; border:0px; padding:0px} div {margin:0px; border:0px; padding:0px} table {margin:auto; border:0px; padding:0px} td {margin-left:auto; margin-right:auto; padding:1px 3px; border:0px; text-align:left; vertical-align:top} ul {margin:0px; margin-left:20px; text-align:left} </style> </head> <body id="top"><h1>Suggested References:</h1> <div><table summary="*"><tr><td><ul> <li>ALT1] 'JavaScript 1.5 By Example', Que</li> <li>ALT2] 'JavaScript, Shelley&amp;Cashman [2001]</li> <li>ALT3] 'Beginning JavaScript', Wrox [2000]</li> </ul></td><td><ul> <li>REF1] 'Pure JavaScript', Sams [1999]</li> <li>REF2] 'JavaScript - The Definitive Guide', O'Reilly [2001]</li> <li>REF3] 'JavaScript Unleashed', Sams [2003]</li> </ul></td></tr></table></div> <hr id="bot" /> <a href="home.htm">JR's Home Page</a> | <a href="#top">Top of Page</a> | <a href="mailto:VE3LL@RAC.CA?Subject=[jssked.htm]">Comments</a> | [jssked.htm:2003 12 09]</body></html> Reproducible: Always Steps to Reproduce: 1. copy test code and run 2. run again in opera 3. and again in msie Actual Results: left margin of list items too far to right causing wrap not seen in opera or msie. Expected Results: calculate auto margin on table and/or td correctly.
> Check the offset against opera and msie. I just compared the page in Mozilla nightly 2003-12-08-14 and Opera 7 on Linux and the renderings look pretty much identical. Could you please clearly describe the problem? Is the issue that you have the following rule: ul {margin:0px; margin-left:20px; text-align:left} Which sets the ul margin to be _smaller_ in IE while it sets it to be _larger_ in Mozilla? In mozilla, the list-item indent is done by a left padding on the <ul>, not a left margin.
Please note the alignment of the bullet !! In msie it is under the 'S' of suggestion. In Opera it is under the 'u'. In mozilla it is between the two 'g's and this much of a shift causes a word wrap to occur! To me this is significant as it destroys the look of the table. If i try to set margin-left of ul smaller the bullet disappears in other browsers so that isnt option.
Then set padding-left to 0 on the <ul> so that the styles will be the same in all the browsers. Mozilla is behaving completely correctly given the CSS you are applying to that <ul>.
Status: UNCONFIRMED → RESOLVED
Closed: 21 years ago
Resolution: --- → INVALID
And see bug 2038 for more information.
Status: RESOLVED → UNCONFIRMED
Resolution: INVALID → ---
*** This bug has been marked as a duplicate of 27851 ***
Status: UNCONFIRMED → RESOLVED
Closed: 21 years ago20 years ago
Resolution: --- → DUPLICATE
You need to log in before you can comment on or make changes to this bug.