> Hello there, I recently coded a layout and I seen to be
> having some positioning problems.
> First of all, I uploaded the test website
> here <http://www.nouhad.technat.org/hatharudhan/> and the
> corresponding CSS file
> here <http://www.nouhad.technat.org/hatharudhan/styles.css>.
> For those of you that are curious the website's name means 24
> hours in my language.
> My divs are structured in the following format :
> <div id="wrap">
> <div id="container">
> <div id="header">
> <div id="topbar">
> <div id="side">
> <div id="content">
> <div id="footer">
> Anyway, getting to the point, the problems that i have (so
> far) are :
> 1. the Content div seems to float down in an odd manner
That is because your div#side is 200px wide, plus 1px border, is
201px wide. The container is 800px wide, so there is only space
for a div#content of 599px, not 600px.
> 2. line-heights are a bit abnormal
I don't know what you mean? You've set a line-height of 25px on
div#content, but since there is only one line in there, it's
difficult to see the effect of that. Be aware though, that 25px
may not be enough when someone is increasing their font-size.
Best set line-height in ems, or leave it out.
(btw - you have an unfinished line in the styles for body)
> 3. since my wrapper is coding like so :
> margin: 0 auto;
> width: 800px;
> I cannot apply paddings within divs :(
You can if you have an extra inner div inside the divs you
Say you have a div of 200px wide. Adding a padding of 5px, would
make the div 210px wide.
To avoid that problem:
IE7b2 testing hub -- http://css-discuss.incutio.com/?page=IE7
List wiki/FAQ -- http://css-discuss.incutio.com/
Supported by evolt.org -- http://www.evolt.org/help_support_evolt/