CSS div question

codingmasta

12-20-2006, 05:25 PM

Hey my "overflow" scroll has problems. This is just my trial template(idk lol) It has the scrollbar, but when there are a lot of text, them, the div's, expand.

<html>
<head>
<style>
body {background-color: black;}
h1,h2,h3,h4,h5,h6 {color: white}
th{background-color:#a52a2a;font-family:verdana;font-size:29px;border-color:white;border-style: solid; border-width: 1px; border-bottom-color: #ccffcc;border-top-color:black}
div.1
{
overflow: scroll;
background-color:indigo;
border-style: inset;
width="8cm"
}
</style>
</head>
<body>
<table align="center">
<tr>
<th colspan="250">Page title<hr width="275" color="white"><h6>Page description</h6></th>
</tr>
</table>
<hr color="white" onmouseover="style=color='#ccffcc'" onmouseout="style=color='white'"><br><div class=1><h6>Current news here. Current news here. Current news here.Current news here. Current news here. Current news here.Current news here.Current news here. Current news here. Current news here.Current news here.Current news here. Current news here. Current news here.Current news here.Current news here. Current news here. Current news here.Current news here.Current news here. Current news here. Current news here.Current news here.Current news here. Current news here. Current news here.Current news here.Current news here. Current news here. Current news here.Current news here.Current news here. Current news here. Current news here.Current news here.Current news here. Current news here. Current news here.Current news here.Current news here. Current news here. Current news here.Current news here.Current news here. Current news here. Current news here.Current news here.Current news here. Current news here. Current news here.Current news here.Current news here. Current news here. Current news here.Current news here.Current news here. Current news here. Current news here.Current news here.Current news here. Current news here. Current news here.Current news here.Current news here. Current news here. Current news here.Current news here.Current news here. Current news here. Current news here.Current news here.Current news here. Current news here. Current news here.Current news here.Current news here. Current news here. Current news here.Current news here.Current news here. Current news here. Current news here.Current news here.Current news here. Current news here. Current news here.Current news here.Current news here. Current news here. Current news here.Current news here.Current news here. Current news here. Current news here.Current news here.Current news here. Current news here. Current news here.Current news here.Current news here. Current news here. Current news here.Current news here.Current news here. Current news here. Current news here.</h6></div>
</body>
</html>

whizard

12-20-2006, 05:38 PM

Your page doesn't have a doctype, and fails validation.

If it doesn't validate, it is very hard to debug.

Try fixing those problems first, and see what you have.

Dan

codingmasta

12-20-2006, 06:02 PM

Well, what doctype?

whizard

12-20-2006, 06:03 PM

Well, HTML 4 should be fine, but if you're up a little more work, I'd recommend XHTML 1.0 Strict

Dan

Arbitrator

12-20-2006, 07:06 PM

The overflow property does nothing for an element that does not have assigned dimensions. If you want the element to have a scroll‐bar appear when its content overflows a certain width or height, you must first assign the element a width or height as the threshold for the overflow.

Errors:

The document type declaration is missing (already mentioned).
The head element is missing the required title element.
The style element is missing the required type attribute.
“width="8cm"” is not a valid CSS declaration.
You’ve set a colspan attribute value of “250” when the table only has one column.
The hr element doesn’t have a “color” attribute.
“style=color='#ccffcc'” and “style=color='white'” are not valid JavaScript. That code should most likely be written as this.style.color = '#cfc'; and this.style.color = 'white';.

Other issues:

Declare a generic font family in case the user doesn’t have the listed fonts. Example: font-family: Verdana, sans-serif;.
You can condense related CSS properties:

Example: font: bold 29px Verdana, sans-serif;.
Example: border: 1px solid white;.

You can condense hexidecimal color values. For example, #ccffcc and #cfc are equivalent.
Use the modern form of the align attribute (on a table element): the CSS margin: 0 auto declaration. Note: doesn’t work in Internet Explorer without a document type declaration.
Use the modern form of the width attribute: the CSS width property.
Use the modern form of the color attribute: the CSS color property.
Using tables for layout is not semantic.
Using an h6 element without also preceding that element by the h1, h2, h3, h4, and h5 elements is not semantic.
Putting content other than a header inside the six header elements is not semantic.
Use CSS instead of the br element to create white‐space.
Surround all attribute values with double quotes for consistency. While not required in HTML, it’s good practice. They are required in XHTML.

codingmasta

12-21-2006, 03:05 PM

Ok ty's