Jump to content
Sign in to follow this  
rlmEEna

how to make a table like structure

Recommended Posts

i want to make a table like structure in CSS. can anyone help me out.i want to make a table in CSS with 3 rows in which middle row has 3 columns. like this one.

______________________|_____________________||    |                                |    ||    |                                |    ||    |                                |    ||    |                                |    ||    |                                |    ||    |                                |    |______________________|_____________________|
i dont want to use tables due to some problems, so i want to do it in CSS. can any one make a CSS and HTML for me for this work..thanks a lot.

Share this post


Link to post
Share on other sites
<html><head><title>Untitled document</title><style type="text/css"><!--body {text-align: center;}div {margin: 2px auto auto auto;background-color: #00aaff;border: groove 3px #ffffff;}div#header {width: 800px;height: 75px;position: absolute;top: 10px;left: 112px;}div#left {width: 150px;height: 450px;position: absolute;top: 85px;left: 112px;}div#middle {width: 500px;height: 450px;position: absolute;top: 85px;left: 262px;}div#right {width: 150px;height: 450px;position: absolute;top: 85px;left: 762px;}div#footer {width: 800px;height: 50px;position: absolute;top: 535px;left: 112px;}--></style></head><body><div id="header">Header, banner?</div><div id="left">Left column, menu?</div><div id="middle">Middle column, main content?</div><div id="right">Right column, ads?</div><div id="footer">Footer, © webmaster</div></body></html>

Here's an example, but it's not easy to change if you want other width's and height's for your document due to the absolute positioning. You can of course change background for border and columns, or have no color. If you don't know much css, and can't edit it, get back to us here with your width and height and stuff...

Share this post


Link to post
Share on other sites

Glad to be of help... :)

Share this post


Link to post
Share on other sites

Join the conversation

You can post now and register later. If you have an account, sign in now to post with your account.

Guest
Reply to this topic...

×   Pasted as rich text.   Paste as plain text instead

  Only 75 emoji are allowed.

×   Your link has been automatically embedded.   Display as a link instead

×   Your previous content has been restored.   Clear editor

×   You cannot paste images directly. Upload or insert images from URL.

Loading...
Sign in to follow this  

×
×
  • Create New...