Need help on CSS page block layout

liunx

Guest
I am working on a layout that will have
three boxes. and a child in the upper lefthand corner. This will be for first page, all other pages will not have the child. The CSS layout should look like this table.
<table width="70%" border="1" cellspacing="0" cellpadding="0">
<tr>
<td rowspan="2"width="15%">
<div align="center">Header</div>
</td>
<td colspan="2"width="90%">
<div align="center">Menu<br>.<br></div>
</td>
</tr>
<tr>
<td width="70%">
<div align="center">Content<br>.<br>.<br>.<br><br>.<br>.<br> .<br></div>
</td>
<td width="10%>>
<div align="center">Info<br>.<br>.<br>.<br>
</div>
</td>
</tr>
</table>

The layout is odd for the first column and child, but I am trying to do a css version of a table page.
Thanks for your help. I have most of it kinda solved except the header and the childYou mean you want to change that to divs and css and only have a certain part of it on a certain page or do you mean moving a <td> somewhere dependant on what page is displaying it? Not sure if ya can do that with a table if that's what ya mean. Never tried something like that with a table before.You mean you want to change that to divs and css and only have a certain part of it on a certain page or do you mean moving a <td> somewhere dependant on what page is displaying it?
No I will not use tables. I want Css and style sheets to do it
The empty table I posted is only to show what the blocks will look when done in CSS and style sheets. There is no other way except code to show what I am looking for.

The upper left corner is my biggest problem. I am very good at tables, but trying to get past them.Hi -
Just wanted to mention that I think a lot of people get
'CSS-headaches' because they keep thinking in terms of a table-based layout or how they first learned to code. Forget that way of approaching the design, and I believe you'll have an easier time of it.

It helps to just do the content first, then apply styles to make it look like how you want. If you are already familiar with how block-level and inline elements 'behave' in the default flow, then working with CSS won't be that much of a challenge - just use a 'container' to house the content / help control initial size, margins, etc.

Drop in the header at the top, and when it comes to floating content - remember to clear: afterwards! Apply the styles as you believe they should be done - then come back and ask for specific help, yes?

That odd section will probably need to be positioned absolutely after the rest of your content - then 'tweak' results if screwy. [Relative is a bit easier to use in my mind - esp. for 'flexible' pages...] Or, code it / position it FIRST on the page - then remove it in your subsequent ones.

Good luck, hope this wasn't just a ramble...
ElI didn't expect you guys to do my dirty work for me, being around here for a while, how else will I learn.
I have been working pretty damn late every night and got this far. Pretty good for the first time at CSS. So here are some of my stumbling blocks.
1 There is an overlapping block, it should be there but needs alignment in NS7. IE is OK.
2 The screen is stretched in NS7 OK in IE
3 The title block should line up to the top.
4 There is one style table (oop's) in the content block. It is there because when finished there must be a border and a different background color.
Take a look,
Click here (<!-- m --><a class="postlink" href="http://www.citlink.net/~jdavia/sample/sample.html">http://www.citlink.net/~jdavia/sample/sample.html</a><!-- m -->)

ThanksOK Here is what I have so far.
It is only the first page, and all the links still work to the old pages. So please overlook that for now. At least you can compare and see what I am trying to accomplish.
The CSS page can be viewed
HERE. (<!-- m --><a class="postlink" href="http://www.citlink.net/~jdavia/sample/sample_files/styles.css">http://www.citlink.net/~jdavia/sample/s ... styles.css</a><!-- m -->)

I cannot solve centering the CSS buttons, or the images in the menu. My guess is it is in the Css file, but maybe I need to add something to it. I am very new in converting from tables to CSS,and I haven't had any luck in accomplishing that yet.
Can someone help me with this? Thanks
 
Back
Top