Stylesheets - overflow:scroll and Doctype issue

Author

overflow:scroll and Doctype issue

ObjectEvolution

2007-07-05, 6:18 pm

Hi,

I have a fairly simple page (see code below) with a div that's styled
with overflow:scroll. Given that, if there is no Doctype in the page
or it's an HTML 4 variant it works fine. If there is an XHTML Doctype
(any of them) the overflow:scroll doesn't work.

Anybody know what's going on here? Any advice?

Cheers and thanks in advance.

Jon

<html>
<head>
<title></title>
<style type="text/css">

#container
{
height: 95%;
}

#header
{
height: 5%;
background-color: purple;
}

#leftcol
{
float: left;
width: 30%;
height: 100%;
}

#shots
{
height: 70%;
background-color: orange;
overflow: scroll;
}

#shotinfo
{
height: 30%;
background-color: green;
}

#rightcol
{
float: right;
width: 70%;
height: 100%;
}

#tasks
{
height: 30%;
background-color: red;
}

#elements
{
height: 30%;
background-color: yellow;
}

#notes
{
height: 40%;
background-color: blue;
}

</style>
</head>
<body>
<div id="container">

<div id="header">Header</div>

<div id="leftcol">

<div id="shots">

</div>

<div id="shotinfo">Shot Info</div>

</div>

<div id="rightcol">

<div id="tasks">Tasks</div>

<div id="elements">Elements</div>

<div id="notes">Notes</div>

</div>

</div>
</body>
</html>

Jukka K. Korpela

2007-07-05, 6:18 pm

Scripsit ObjectEvolution:

> I have a fairly simple page (see code below) with a div that's styled
> with overflow:scroll.

It's hardly a simple page.

> Given that, if there is no Doctype in the page
> or it's an HTML 4 variant it works fine.

Things are more complicated than that. The exact form of the doctype
declaration is essential as regards to standards vs. quirks mode. As usual,
URLs would have been useful.

> height: 95%;

Of what? There's great difference between standards and quirks mode in
interpreting this.

--
Jukka K. Korpela ("Yucca")
http://www.cs.tut.fi/~jkorpela/