Help with CSS Sheets

**msbutton** · 01-06-2007, 05:23 PM

First of all I apologize for being new to CSS sheets and most likely asking a question that is probably simplistic in nature.

I have a "Liquid" CSS that essentially works like a frame.

I have a header, left menu, footer, & main content.

I am trying to setup a standard for a bunch of groups and decided to learn more about CSS as it undoubtfully will help me.

So here is my dilemina - I have my header created and placed in a <DIV> tag, along with my Menu, Footer & content. I would like to setup a sheet/web page that will allow me to work like a frame. Therefore when the main/index page is opened it would load the header, footer, menu, main - this way each time I create a page for the content it does not have to be in one sheet.

Does any of this make sense

Currently I have my header, menu, footer, content (many various pages) all in one HTML page - I was hoping to seperate things - Currently all my content, header, footer, menu are all in one page seperated by <DIV> therefore want to know if i can set up something in the <DIV> to load specific pages (basically my three main ones).

I guess when I look at it I can have multiple pages, just link my menu to it all - but then If i update something in my menu or header/footer I have to update it on ALL pages - seems like a lot of work than...

**NineTwoZero** · 01-06-2007, 07:14 PM

u can do it this way (with php or asp)

Code:

php method, put this in ur index file:
<?php include("header.php") ?>
<div id="index">your "text" here.</div>
<?php include("footer.php") ?>

and in ur "header.php" you can have:

Code:

<html>
<head>
<link rel="stylesheet" type="text/css" href="style.css" />
<title>woohoo</title>
</head>
<body>
<div id="site">
<div id="banner"><img src="banner.png" alt="banner border="0" /></div>
<div id="menu">
<img src="button1.png" alt="button 1" />
<img src="button2.png" alt="button 2" />
<img src="button3.png" alt="button 3" />
</div>

Then u gotta have a footer too. (footer.php)

Code:

<div id="footer">
w/e u want here</div>
</div>
</body>
</html>

so basiclly, what this does is that the code loads from 3 different files so that its easier to "fix" them.

Code:

<html>
<head>
<link rel="stylesheet" type="text/css" href="style.css" />
<title>woohoo</title>
</head>
<body>
<div id="site">
<div id="banner"><img src="banner.png" alt="banner border="0" /></div>
<div id="menu">
<img src="button1.png" alt="button 1" />
<img src="button2.png" alt="button 2" />
<img src="button3.png" alt="button 3" />
</div>
<div id="index">Your "text" here</div>
<div id="footer">
w/e u want here</div>
</body>
</html>
<div id="footer">
w/e u want here</div>
</div>
</body>
</html>

might be a lil hard to understand but ill try to explain it better if u need it

**msbutton** · 01-06-2007, 07:24 PM

Kalle thank you for the suggestion, but I am a little confused on how this all goes to gether.

So do i now have 4 files
1. Header
2. Footer
3. Left Menu
4. Content
5. PHP File

In your last code I do not see where you are calling these files to be incorporated...

Again sorry if this is stupid questions, just not 100% how this works.

**NineTwoZero** · 01-06-2007, 07:26 PM

the last code is what you'll see if u check the source code

**NineTwoZero** · 01-06-2007, 07:36 PM

btw you can use the include on every page you're gonna have on ur site. jus change the text in the

Code:

<div id="index">new text.</div>

**msbutton** · 01-06-2007, 10:42 PM

Kalle - I apologize I am completely lost now - is there a website with examples that I can see, unfortunately I am a visual person

I still do not know what I have to do, do I create a file called: header.php, footer.php, menu.php and have them all loaded into a main file, which would be my various pages of content - sorry for not fully understanding, your patience would be greatly appreciated.

**NineTwoZero** · 01-06-2007, 10:45 PM

hmm check my "betapage" http://underground.ninetwozero.com

im usin include on it

Thread: Help with CSS Sheets

Thread Tools

Search Thread

Help with CSS Sheets

Bookmarks

Bookmarks

Posting Permissions