Content and footer problem in 2 column layout

[Neo]

Hi,
  I have a problem in aligning the content of a two-column layout. The content is overflowing the text area where it is supposed to be present and the footer is going below the right hand side block instead of appearing at the bottom of the page.

The link to the page is below.

http://cms.ce.gatech.edu/gwri/home/.

The problem seems to be reproduced in Firefox alone but works fine in Internet explorer  . Any idea how should i handle this?

Thanks,
Neo

[heatherfeuer]

I took a quick look at your source code.  I'd say it's most likely that you missed a closing somewhere (possibly included inadvertently in the commented out portion).  That may be why the content is "overflowing" its container.

[kermit]

easy way to fix the layout is to insert a "clearing div" after the 2nd column:

     
     
     

(unrelated to layout problem) markup validation issues:

some image tags aren't closed properly (for xhtml doctype).. they should be closed with " />"
[/b]

another thing the validator is complaining about is nesting inside of . remove the tags that wrap the calendar table and apply a style to the table instead.. try: style="font-size:85%;width:100%;"

[Neo]

Thanks kermit and heatherfueuer. It resolved the problem which I had mentioned  . I will also try the suggestions for the font tag and image tag.

But how do you know what errors the validator is reporting? Because I was not aware of these errors before kermit reported them to me!

Thanks,
Neo

[RonnyK]

Neo,

if you use FF, you can install some additional tools, that help in developing.

http://forum.cmsmadesimple.org/index.ph ... l#msg54320

You can also add a tag to your template {valid_xhtml} that opens the validation-result on clicking for the page your on.

Ronny

[kermit]

html validator (pictured), firebug, and web developer toolbar (firefox extensions) are a few must-have tools for any web designer or developer...

firebug is great for examining how styles get inherited, i prefer the web developer toolbar's in-place html/css editing to firebug's (simpler, faster), and the html validator gives on-the-fly, near-instant validation test results (runs on the local pc, doesn't upload files to a web site to validate). both firebug and the web developer toolbar have A LOT of features and tools.

also note that your right side float falls as the browser (firefox, here) width is narrowed (and before it hits min width)... see attachment.

[gelöscht durch Administrator]