...

View Full Version : Can I do this with CSS?



jPaul
05-31-2005, 03:24 PM
Good Morning Everyone,

The attached jpeg is an example of a page-style I would like to manage my site with. I don't know how to prepare a CSS for it though... If I can use just a table structure or if I have to use frames. duhhh,
I wonder if someone might help me out...

The "Header", "Footer", and "Menu Buttons" parts don't need to change, but the various button selections will call different html files for the "Documents" part, and if I can get away with it, I'll use animated GIFS for the "red" box just to even things visually. ( Otherwise there will be a chunk of wasted white space there)

Anyone??

many thanks,
Paul

NancyJ
05-31-2005, 03:37 PM
http://www.456bereastreet.com/lab/developing_with_web_standards/csslayout/2-col/

JamieR
05-31-2005, 04:06 PM
That's possible with css - it shouldn't be too *hard* to do :)

jPaul
05-31-2005, 04:21 PM
Thanks Nancy and weazel...

I'll study that page you've sent Nancy, and see if I can make sense of it enough to modify it. I am so much further ahead and I appreciate your lead.

Regards,

Paul

NancyJ
05-31-2005, 04:25 PM
Its a pretty indepth tutorial, though their nav column is on the right not the left but its easy enough to switch them around

jPaul
05-31-2005, 04:35 PM
Hi Nancy,

I'm lost already...
I don't know which parts belong in a *.css file, and which parts will belong in the *.shtml files.
I'll wander around that site and find a simpler example and then perhaps graduate to fooling with the code

Thanks
Paul

NancyJ
05-31-2005, 04:44 PM
anything that looks like

#name {
property:value;}


goes in the css, the

<div id = "name"></div> etc goes in the html page

muhaidib
05-31-2005, 05:16 PM
here you go :)


this is index.htm

<html>
<head>
<title>call it what ever you want</title>
<link href="style.css" rel="stylesheet" type="text/css">
</head>

<body>
<table width="228" height="258" border="1">
<tr>
<td height="43" colspan="2" class="head">&nbsp;</td>
</tr>
<tr>
<td height="116" class="menu">&nbsp;</td>
<td rowspan="2">&nbsp;</td>
</tr>
<tr>
<td height="63" class="links">&nbsp;</td>
</tr>
<tr>
<td height="24" colspan="2" class="head">&nbsp;</td>
</tr>
</table>
</body>
</html>



and this as style.css


/* CSS Document */

body {
background-color: #CCCCCC;
font-family: tahomha;
}

table {
background-color: #FFFFFF;
}

td.menu {
background-color:#00FFFF;
border: 1px;
}

td.head {
background-color:#FFFF00;
border: 1px;
}

td.links {
background-color:#99FF00;
border: 1px;
}

NancyJ
05-31-2005, 05:25 PM
::raises eyebrow at table layout::

Kurashu
05-31-2005, 06:05 PM
A two column with footer and header layout is an easy design with CSS. I use it all the time.

Google a guide or follow the link Nancy posted.

jPaul
05-31-2005, 06:06 PM
Thanks for that code, muhaidib.
(Cool nick... makes me think of spice)
You've provided code that I can understand and therefor get a whole lot closer to what I want to do..... eventually.
Now, can I... (and how do I)... format the "table-structure details" in the CSS document? Most of those details will be static, such as the "Header" and "Footer" images... even the javascript code for the menu will always be in the same table-cell.
I'm thinking that if I can place all of that stuff (that will never change)in the CSS file, then each of the html pages need refer only to the CSS and then the calls to fill the "animated GIF" and documents page parts.
Do I have the right idea?



EZ Archive Ads Plugin for vBulletin Copyright 2006 Computer Help Forum