CSS issues on this board

[tomreyn]

Hey, that's really a minor issue, but I thought I'd point it out since I assume this might actually be of interest to Omega...
There's currently a few issues with the default CSS of the default theme here.

Thanks for maintaining the forums.

[Omega]

Thanks for pointing those out. Let's take a closer look though, to spread out the true "bugs" and the invalid parameters.

61    body   Property tab-size doesn't exist : 4 4
62    body    Property -moz-tab-size doesn't exist : 4 4
63    body    Property -o-tab-size doesn't exist : 4 4

Tab-size is an experimental CSS value not yet officially supported. By default MOST browsers display a tab as 8 spaces. Let's be honest, no plaintext editor uses such a large number, usually. Thus, we set a CSS value so that browsers that support it will display tabs as 4 spaces. Obviously, being unofficial, not all browsers support it, so they'll see the default 8 spaces per tab, but those that do support it will see a much more readable 4 spaces per tab. This helps with formatting of code.

Code: (css) [Select]

body
{
background: #000;
font: 78%/130% "Verdana", "Arial", "Helvetica", sans-serif;
margin: 0 auto;
padding: 0;
tab-size: 4;
-moz-tab-size: 4;
-o-tab-size: 4;
}

593    .error    Value Error : color fff is not a color value : fff fff
602    .alert    Value Error : color fff is not a color value : fff fff

This here is a rather bad error on my side. I somehow managed to forget the "#" in front of a hex number, so instead of "#fff" (white), it simply said "fff". Most modern browsers are able to detect this sadly common error and fix it, so it managed to bypass my attention.

Code: (css) [Select]

.error
{
color: #fff;
}
.alert
{
color: #fff;
}

1183    .dropmenu li li a:hover, .dropmenu li li:hover > a    Value Error : background-color rgba(10,10,10,0.15) is not a background-color value : rgba(10,10,10,0.15) rgba(10,10,10,0.15)

Like the tab-size value above, rgba is not officially recognized in CSS 2.1, but CSS 2 is old (first published in May 1998, to be exact). It's valid if you choose the CSS 3.0 validator option. Unlike plain old RGB colors, RGBA lets us insert an alpha value as well, which is used on the drop down menus when we mouse over the button, causing it to be a darker color. The fallback for non-supporting browsers is to simply not display this slightly darker shading, so the menu still works, just without the color change on mouse-over.

Code: (css) [Select]

.dropmenu li li a:hover, .dropmenu li li:hover>a
{
color: #fff;
background-color: rgba(10,10,10,0.15);
text-decoration: none;
}

1274    #moderationbuttons_strip    Value Error : padding auto is not a padding-right value : 0 auto 0 auto

This is a slight mishap also on my half. Padding does not have an auto value, only margins do (it's really the only difference in values between padding and margin). As a result, the line will not do anything, and is removed (since the margin line in the same declaration is what actually fixed what the padding was meant to).

Code: (css) [Select]

#moderationbuttons_strip
{
width: 720px;
margin: 0 0 0 20px;
}

Hopefully that explains why some of the errors occur in validation. The true errors (that is, the color codes and padding) have been fixed and uploaded. Thanks for bringing it to my attention.