View Full Version : External CSS...don't understand?
Shirl 08-04-2004, 04:02 PM Yes, I am slow. :P Heh, well I've got basic CSS memorized almost, and I'm starting to build my site...in fact, I have the index page finished already. Now then, that index page is just basicly the "Click to enter my site" page...and has nothing to do with the rest of the site. The rest of the site, I would like to have a left navigational menu...and I have looked at Lissa'a explanation of how to use an external style sheet so that I dont have to put all those links and junk on EVERY page I create, but it only confused me greatly :D Could someone please explain it a bit more simpler for me? Thanks in advance...:)
Monkey Bizzle 08-04-2004, 04:10 PM Okay, you said that you wanted a left navigational menu so i am going to use lissa's template for that...
<html>
<head>
<title>Two Column CSS Layout</title>
<style type="text/css">
body
{ margin-top: 0;
margin-bottom: 0;
margin-left: 0;
margin-right: 0;
padding-left: 0;
padding-right: 0;
}
#menu {
position: absolute;
left: 5px;
padding: 0px;
width: 150px;
}
#content {
margin-left: 200px;
padding: 0px;
margin-right: 15px;
}
</style>
</head>
<body>
<div id="menu">
Your menu will go here. You can place images, text links, etc. in this div. To change the properties of this layer you can change the #menu selector in the style sheet that is located on this page between the head tags.
</div>
<div id="content">
All of your content goes in this div. This side is fluid so that if the window is collapsed, your div will collapse also and fit the screen perfectly. To change the properties of this div you can change the #content selector in the style sheet that is located on this page between the head tags.
</div>
</body>
</html>
to have an external syle sheet, make a CSS file and call it style.css and then take all the bold above and cut and paste into your CSS file and get rid of the <style> tags...
then, in the head tags of each page that you want to use this style sheet... put
<LINK href="style.css" rel="stylesheet" type="text/css">
Then... you should have something that looks like this...
<html>
<head>
<title>Two Column CSS Layout</title>
<LINK href="style.css" rel="stylesheet" type="text/css">
</head>
<body>
<div id="menu">
Your menu will go here. You can place images, text links, etc. in this div. To change the properties of this layer you can change the #menu selector in the style sheet that is located on this page between the head tags.
</div>
<div id="content">
All of your content goes in this div. This side is fluid so that if the window is collapsed, your div will collapse also and fit the screen perfectly. To change the properties of this div you can change the #content selector in the style sheet that is located on this page between the head tags.
</div>
</body>
</html>
Now whatever you want to put in your menu, would would put in that sections and anything you want in your content, you would put in that section... make more sense now?
Shirl 08-04-2004, 04:19 PM Er...so I just cut and paste the bold..edit it to the content and whatnot that I want, and put that little code in the head of the pages I want the menu to appear on? (I'm giving myself a migrane lol)
Monkey Bizzle 08-04-2004, 04:25 PM yes, cut the bold and put it in your external sheet called style.css, then put the <link> tag in the head where the styles WERE at... then edit the content in the divs and you should be good to go... then, if you have like 5 pages with the same layout, you would always put that same <link> tag but just edit the content on each page... so... if you wanted to change your colors or something like that... then you would just cahnge the style.css file and it would change the colors on ALL the pages that have the <link> tag... you can add more styles to your CSS tho... the below is just to get the layout that you want... I am SURE you have looked at lissa's CSS pages so, just put the things that you want in your style.css file and you will be an expert in no time!!
Shirl 08-04-2004, 04:31 PM :::hugs Monkey::: Thank you! :D lol I was confusing myself to no end. :) I think I'd die if I had to put all those links over every page lol...I know I'll have at least 20 pages with the same layout!......now then....so I would leave the menu the same for every page, and just edit the content correct? Forgive me, I am doing my best to keep busy online and not brutally strangle my annoying brother lol :D
Monkey Bizzle 08-04-2004, 04:38 PM yes exactly... and once you have the layout part set up on each page, then you can worry about adding in color and scroll bars and cursors and all that stuff. the beautiful thing about CSS is you can design 50 billion pages and then go back and change that one little file and all 50 billion pages are changed... it's just, so... great ya know... makes me want to cry... LOL j/k!
Shirl 08-04-2004, 04:44 PM Oh yay, I understand completely now! :D Thank you! hehe, I've already got the color scheme and scroll bars chosen. I would have given up completely if you I had to resort to manually editing each page. lol :) Now then....if I could only master php, I would be in euphoria! :D hahaha
Monkey Bizzle 08-04-2004, 04:49 PM well, the only thing i know about PHP is includes so if that is what you are talking about that is SOOOO easy too!! ... i can help you with that if you want also!
Shirl 08-04-2004, 04:51 PM Hehehe, I think I'd better get my site finished first. :) Don't want to bite off more than I can chew. :D Eventually though I want to learn it and put a forum on my site. :P OoO goody, It feels like Chirstmas lol, learning something new is a new toy for me :D hahaha, I'm weird. I find it is fun to type codes from memory. :D
Monkey Bizzle 08-04-2004, 04:53 PM LOL!!! i just redid the layout for the site i have with pics of my daughter and i used PHP and broadened my horizons and used pink instead of blue like i use for EVERYTHING and when i was done i was so pleased with myself that i just kept going back to it just to look at it... LOL...
Shirl 08-04-2004, 04:56 PM :) Yeah, I am ashamed to admit that I once used an "easy and simple drag and drop page maker" :P haha, they are evil. I love starting from scratch, so much more fun and original. I put alot of thought into my content and I can estimate that my site won't fully be done until several months from now. :D
Monkey Bizzle 08-04-2004, 04:57 PM well, good luck...
Shirl 08-04-2004, 05:01 PM Thank you.:) I would be lost without LEIA. :D
fahad 08-04-2004, 08:45 PM Thats good that you got it in the end.. Lissa has CSS tutorials and so do I C Drive (http://www.geocities.com/alkaholicvirgo89/help.html) ...
aiways first when i first time ever [not here] saw the word LEIA I thought it was a degree :P but then i concentrated and figured it out lolz
Shirl 08-04-2004, 08:50 PM Heheh, Oh I know how to do CSS...I was just having trouble getting an external style sheet to work, but thanks to Monkey, I'm all set....now its just long, countless hours of actually building the other 20 or 30 pages of my site lol. :D
|