Prev: expression
Next: Unexplainable margin
From: Gary on 14 Jul 2008 19:59
Hello folks,
I have a simple bug that defies my ability to find a work around. In
IE7 strict-mode, if you have a table with width 100% in a DIV block..
the content will appear UNDER the div's scrollbar. If you switch to
quirks-mode the problem goes away - meaning the table width adjusts to
accomodate the scrollbar.
To see, display the follow html and click "add text" until you get a
scrollbar. Some text will appear under the scrollbar. Remove the
doctype tag, and reload, to go into quirks-mode, and the problem is
not reproducable.
Anyone know what is going on, or have a work around?
Thank you!
Gary




<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://
www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd"><html lang="en"
xml:lang="en" xmlns="http://www.w3.org/1999/xhtml">
<html>
<head>

<style>
#box { border:1px solid #000; height:70px; width:50%; overflow:auto;
overflow-x:hidden }
#text1 { background:#fff; }
#text2 { background:#fcc; }
</style>

<script>
function addText(){
var el = document.getElementById("text2");
el.innerHTML += "a ab a abc a abcd a abcde";
}
</script>


</head>
<body>

<div id=box>
<table width=100%>
<tr><td width=50%>
<div id=text1>test test</div>
</td>
<td>
<div id=text2>test test</div>
</td></tr>
</table>
</div>

<a href="#" onclick="addText(); return false;">add text</a>


</body>
</html>
From: dorayme on 14 Jul 2008 22:37
In article
<7616e128-459f-400f-b8a1-6457280918c1(a)i76g2000hsf.googlegroups.com>,
Gary <gneier(a)gmail.com> wrote:

> Hello folks,
> I have a simple bug that defies my ability to find a work around. In
> IE7 strict-mode, if you have a table with width 100% in a DIV block..
> the content will appear UNDER the div's scrollbar. If you switch to
> quirks-mode the problem goes away - meaning the table width adjusts to
> accomodate the scrollbar.
> To see, display the follow html and click "add text" until you get a
> scrollbar. Some text will appear under the scrollbar. Remove the
> doctype tag, and reload, to go into quirks-mode, and the problem is
> not reproducable.
> Anyone know what is going on, or have a work around?
> Thank you!
> Gary
>
>
> <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://
> www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd"><html lang="en"
> xml:lang="en" xmlns="http://www.w3.org/1999/xhtml">
> <html>
> <head>
>
> <style>
> #box { border:1px solid #000; height:70px; width:50%; overflow:auto;


As far as I see there is a clash between your specification of width of
100% and your wish to clear the scrollbar. This happens in many
browsers, try adding width: 100%; to the P in:

<http://dorayme.890m.com/alt/scrollBoxTest.html>

I have tested in IE 6 and it behaves as with FF and Safari with and
without the width. With the width at 100%, it grabs the whole width of
the div box, the scroll bars grab a set piece of space *on top"

--
dorayme
 | 
Pages: 1
Prev: expression
Next: Unexplainable margin