hugoa

?? my pleasure.

You have a typo on #main-content your missing the ‘;’ after the width property value.

It would be best if you removed the padding on the container and main-content divs as together with the widths of your content and sidebar they are not leaving enough room and you will find the sidebar being forced to the next clear line. try to pad on inner containers not on layout containers if you can help it, this also avoids the box model problem.

Once you have the width working on the main-content element if you still have problems with text then fix a width to .post to ensure that you get text wrap.

I’m assuming that your referring to the lack of the wrapper background? if so you need to clear the wrapper as at the moment the floats are escaping and not causing the wrapper to expand with them, this is correct behaviour.
Best technique is:

.clearfix:after {
display:block;
content:”.”;
height:0;
visibility:hidden;
clear:both;
}
.clearfix {display:inline-table;}/* for IEMac only */

/* this line hides these rules from IEMac \*/
* html .clearfix{height:1%;} /* for IE*/
.clearfix {display:block;} /* resets to block */
/* end hide from IEMac */

Apply the class ‘clearfix’ to the wrapper element.

Hugo.

Gareth has pretty much got it right with his order I would say. In terms of semantics a header and it’s value are supposed to denote the major divisions of a page viewed unstyled, in essence the major headings H1, H2 should be used once or twice only and they should be towards the top of the page, and subsequent headers should follow the natural order given to them in their #, playing around with the font-sizing of a header is not really correct even if that is only CSS styling and for this reason I have a problem with the way the H2 tag has been used in the sidebar, as H4 or H5 would have been far more appropriate.

The biggest problem I find is the way the H2 heading has been hardcoded into functions such as the get_links_list seemingly presenting the problem of only being able to change it by editing the core links php file. Why can some some functions like the date that Root mentions use supplied arguments that allow you to chnage things such as the generated html and not others?.

Hugo.

Ok commenting it out was inaccurate as the ‘small’ tag has an inherent sizing value whereby it reduces size by a value of 1 but if you had tried adjusting the font-size up as I suggested then you would have seen things improve. Go through your index and remove all the instances of the ‘small’ tag then start again carefully, it’s not really strange it doesn’t manifest itself on other pages, the ‘small’ tag only occurs in the comments single post pages and there you do not suffer as much of a cascade effect.

Hugo

As has been said you need to pay attention to your nesting and closing of tags.

The problem lies with the incorrect nesting and closing of the ‘small’ tag and the fact that you have given it a font-size of .9em where the body default size has already been reduced to 62% / 10px, that in itself will give you fairly illlegible text.

Try changing the font-size in the ‘small’ ruleset in the stylesheet or commenting it out and you you’ll see it normalise.

Remember that em units like percentages are relative units of length so you always need to pay attention to the cascade.

Hugo.

Is the problem sorted ? I’ve just looked there are errors,
I would validate your page as there seems to be a missing closing div to accompany your opening #page

With the footer you seem to have a problem with understanding the use of the padding /margin properties, remove all that heavy padding and negative margins then you footer should line up correctly.

If you had posted the proper link when you posted this problem at csscreator.com then I could have solved this for you straightaway

Always validate your pages as you work it saves a lot of wasted time for all concerned.

it might be nice if the problem is solved to pop back to csscreator.com and close the topic off.

Hugo.

The shorthand property ‘background’ is considered better supported than using the individual properties such as ‘background-image’ , ‘background-attachment’ etc.

Try using:

background: url(images/saintlogo.jpg) fixed no-repeat right top #fff;

Quotes around the url aren’t needed and can cause problems with IEMac, the leading slash also should not be needed if the folder is in the same one as the stylesheet, be careful to ensure spaces after the url closing brace, position is quoted horizontal then vertical.

This may help, but also has the benefit of reducing file size.

Hugo.

In your rules for the class feedback you have clear:both;
this is doing just that and clearing the floated sidebar; remove it and you should be ok.

.feedback {
color: #ccc;
text-align: right;
clear:both // remove!
}

Hugo.

For browsers to switch into ‘Standards Mode’ you need a complete DTD, that is one which has a full url to the doc spec location.

The one you have at present is a 4.01 transitional without url so you are in ‘Quirks Mode’ which is strange as WP out of the box validates to a xhtml 1.0 DTD what I also do not understand is why your using frames ? a rather outdated and disparaged method which I guess would also require the use of the html 4.01 frameset DTD to be valid.

Hugo.

Thanks for the welcome Root, I’ve posted in the past, but not for a while, most of my time taken up with duties on another forum.

I would also like to say that it’s good to see yourself back in the frame so to speak and glad your blogs back up and running for much needed perspective.

Hugo.

It may well be due to the table element not havin any width as well as also having padding it’s taking up 100% of available space and then some. either way it’s forcing the sidebar to expand in IE and drop down , in Firefox it will correctly just oveflow the extra width.

Seeing as you are in Standards mode it’s not IE faulty box model- at least not in IE6- actually the the box model works opposite to above ; the correct box model calculates padding and borders as additions to the stated width of an element. The faulty box model DOES include borders and padding in the intial width calculation which is why one has to filter rules for width to IE5 which can’t render in standards mode and switch on the correct box model hense stated width for IE5 is as written and in standards compliant browsers it needs to be stated width minus any padding or border widths/heights

Hugo.

Actually the lack of support for :hover on anything but anchors in IE is a frustration, it’s wrong to think of the ability as just pointless “bling bling” .

If :hover was supported on all elements then the ‘Suckerfish’ menu would function without reams of Javascript to overcome one little oversight in IE.

The csshover.htc file works well enough bearing in mind that it is Jscript and would be prone to the same drawback that Javascript could have in scripting being disabled client side which is slim as most IE users seem generally unaware how to disable it.

If validation is an issue you can wrap either the link to the behaviour or the body tag inline style, in MS Conditional Comments
to hide it from the validators.

The reason that your having the problems aligning your layout in IE
is due to the fact that you have a comment in the html before the DTD , there must be nothing before the DTD otherwise it switches IE into ‘Quirks Mode’ and IE will not follow CSS rules fully, in this case it does not understand the use of margin:0 auto; it’s important to render in ‘Standards Mode’ for full compatibility with the CSS specs.

Once in standards mode margin auto will work on the wrapper/container for the page and you can then use the text-align:center; on the body and text-align:left; on the first child element to fix things for IE5 which doesn’t render in standards mode and understand margin:auto;.

The use of the hacks that you have are not needed and actualy are not hiding from everything but IE, the escape hack \*/ hides from IEMac to feed a rule to IE only it’s best to use the star selector hack * html #somediv{}

Hugo.

Firepages phpdev,
Apache, mysql, phpadmin bundle plus extras, configured out of the box, one click install.
Download around 10mb which I downloaded on a 56k dialup
firepages phpdev