SitePoint Sponsor

User Tag List

Results 1 to 2 of 2

Hybrid View

  1. #1
    SitePoint Member
    Join Date
    Nov 2002
    0 Post(s)
    0 Thread(s)

    Too Wide a Table in a DIV

    Here is an interesting bug in browser's support of width property. Note try adding 'width: 100%;' in the div and check in both IE and Mozilla. You'll notice that with the width specified in the div, IE bahaves properly but Mozilla/NS makes the table too wide (like in the original case with IE6+). I'd love to hear of your solutions.

    <?xml version="1.0" encoding="us-ascii"?>
    <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"
    <html xmlns="" xml:lang="en-US" lang="en-US">
    <title>test table inside a div with margin and padding</title>
    <div style="border: 2px solid yellow; margin: 50px;">
    <table style="border: 1px solid red; width: 100%;">
    <p>In IE 6.x this table with a red border with be wider
    than the maximized browser window. It's right edge will
    be about 50 pixels beyond the brower's vertical scroll bar.
    If you increase of decrease the <div>'s margin the "over-expanded"
    area will be decreased by the same amount.</p>

    <p>Why? Is this a bug in IE? It doesn't happen in Mozilla 1.2+
    or NS6+.</p>

  2. #2
    SitePoint Member
    Join Date
    Jun 2002
    Miami Fl
    0 Post(s)
    0 Thread(s)
    Netscape/Mozilla are behaving properly. IE is a bit scratchy when it comes to the "box model." You can go here to view a large number of different workarounds that people have found.
    -= Eric


Posting Permissions

  • You may not post new threads
  • You may not post replies
  • You may not post attachments
  • You may not edit your posts