Forum Moderators: open
Basically, my page has an outer table with height set to 100%, and an inner table with the real page content (height="700px"), so that the page appears in the middle of the screen for higher resolutions.
I want the body text at the top of my code, but to appear within a table cell lower down. Possible?
I've read you question twice and I think I understand it well enough to know that I don't want to touch it.
Except to say that I think you're making life too complicated for yourself. Making tables by hand for positioning purposes is Not Sensible; if I were you I would use css margins for this. It's almost never a good idea to set the height of anything to 100%.
The most important thing is to get your content onto the web in a readable and navigable form first, then you can relax and learn presentation and positioning tricks at your own pace.
what I'm trying to say is: take the line of least resistance. If an approach seem too problematic, stop banging your head against a brick wall and try a simpler approach.
Hope that helps...
You are using a table cell to position content on the page so that it at the center. Yet you don't want that content to be in that table cell, but in a different element altogether at the top of the page? Yes?
If this is the case, why are you using the table cell at all? If you are trying to use the td to position content, that content has to be within the it.
May I ask why you don't want to use absolute positioning? You can use it to put your content anywhere you want on the page.
We want this site to be centred vertically and horizontally to suit all screen resolutions. The text is to appear in the main section of the site/screen (i.e. in the middle).
As far as the source code goes, ideally I want this text to be as close to the top as possible - immediately under the <body> tag if possible.
Beginning to think a new approach might be needed.
BTW, I think absolute positioning would be out of the question as the vertical displacement varies with screen res'.
I don't want to touch i
Me neither! Sounds like a nightmare of 'dodgy design' -- no offence intended adam_c I'm no artist ;)
If you choose to go for the nested table, fixed 'window' approach you've pretty much gotta live with the fact that short of some outrageously complicated and fragile coding you'll never do it....
So, it's either back to the drawing board or rethink your design...
Personally I get really mad when I see a little window in the middle of my screen.
Liquid Design Baby! [webmasterworld.com]
Nick
BTW, I think absolute positioning would be out of the question as the vertical displacement varies with screen res'.
Well, if it wasn't for that pesky 700px height requirement and the fact that NN 4.x and (oddly) Opera don't display it right, you could do something this:
body {
height: 100%;
}
div#content {
position: absolute;
background: #FFF;
border: #333;
width: 70%;
height: 70%;
top: 15%;
left: 15%;
overflow: auto;
}Note that, assuming the div is a child node of the body element, you have to give the body a height of 100% to get IE to display correctly in standards-compliant mode. This is because to use a percentage value for height on an element, it's parent node needs to have an explicitly set height property [msdn.microsoft.com].
