View Full Version : CSS vs. Frames


fengshui37
02-15-2004, 07:26 PM
I noticed that Lissa says "why use frames when can do everything with CSS". Quick question...can CSS Layout be used in same way as frames where can have menu on side with links and ONLY one "section" of layout is "targeted" by the link? If so, might be a new section for CSS on the LissaExplains site at some point in the future.

Thanks,
-Feng37 :)

MaGiCSuN
02-15-2004, 07:28 PM
for targetting links you will still need some kind of frames, in this case you could use an iframe for it

http://www.lissaexplains.com/frames.shtml#inline

Love,
Mirna

fengshui37
02-15-2004, 08:12 PM
I'm just looking into CSS as a "better way" of doing things...haven't actually "completely converted" yet though most of my pages have some <style> aspects to them. When (and if) I do, will be a major undertaking.

- Feng37


for targetting links you will still need some kind of frames, in this case you could use an iframe for it

http://www.lissaexplains.com/frames.shtml#inline

Love,
Mirna

Blackdragonhide
02-15-2004, 08:45 PM
Quick question...can CSS Layout be used in same way as frames where can have menu on side with links and ONLY one "section" of layout is "targeted" by the link?

sadly, no :(

frames (whether original or inline flavoured) are the only way to go in that aspect.

MaGiCSuN
02-15-2004, 08:49 PM
to 'fake' it you could just load all the pages with the same layout. So all the subpages have the same layout as the main page. Then you put the content in a scrolling div area and then it will 'look' like it has been targetted to that area, but offcourse all you do is loading the full page.

like i said, there is no other way to 'actually' target links then frames and iframes

Love,
Mirna

fengshui37
02-15-2004, 09:48 PM
Either use frames or set up each page same except for the page that is changing; can you put page layouts into a "separate" style sheet? or do you have to put "page layout definitions" as <style>...</style> into the header as a different entity? I've tried with separate style sheet and so far its formatting the <div>'s correctly BUT first top to bottom rather than laying them out side by side.

- Feng37.

fengshui37
02-15-2004, 10:09 PM
From Lissa's:
<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>

My question is...do you HAVE to put your layout stuff in the header or can it also be incorporated into a separate style sheet? My background isn't working either on the separate style sheet....I'm just beginning this so learning curve is a bit steep right now.

- Feng37 :rolleyes:



Either use frames or set up each page same except for the page that is changing; can you put page layouts into a "separate" style sheet? or do you have to put "page layout definitions" as <style>...</style> into the header as a different entity? I've tried with separate style sheet and so far its formatting the <div>'s correctly BUT first top to bottom rather than laying them out side by side.

- Feng37.

MaGiCSuN
02-17-2004, 11:53 AM
for that div you just put this in your .css file:

#menu { css stuff here }

you can make as many .css files as you want. So for example each page could have it's own .css stylesheet if you want to.

you can change things with css, but you can't put tags in it like <img> etc. So the images should be on a .html page (or .php or .shtml if you use that). CSS is only for changing the look of it :) I'm not sure if that will answer your questions though.

if the site you are having problems with is the site you PM'ed me then unfortunally i can't take a look at it right here (at school on the imac) because it totally crashed the computer. if it's NOT that page, then could you show us wich page you are having problems with with the background?

Love,
mirna

fengshui37
02-18-2004, 11:13 AM
The sight I PM'd you on is the page I was working with. I got it working leaving background in the traditional body tag for the index file. I was curious why it hadn't been working on the css sheet. I'll try the #layout-partition-name fix. The index page is at geocities, subfolder is same nickname as I use here; my actual homepage is listed in my profile here but I haven't played around with any css there yet...using this older page to experiment).

It shouldn't have crashed ANY computer with a working up to date browser (I've never tried an imac though; there is some javascript that I wrote to select the background image based on visitors screen resolution (size) setting and maybe imac has some odd size that I didn't anticipate in my coding...also some javascript that detects the browser and puts message and link accordingly for a page with an MS AGENT character). There are several applets (linkers) inside the iframe I made and one on the main body of the page...they might not have been compatible with an apple OS or browser either. The screen size selector part is going to go away...I plan to lose the side images on the main background strip and put those in as transparent background on the #side division partition...just haven't tried it on hard-drive yet (I always make it work on hard-drive before uploading to server).

Thanks again.
- Feng37

for that div you just put this in your .css file:

#menu { css stuff here }

you can make as many .css files as you want. So for example each page could have it's own .css stylesheet if you want to.

you can change things with css, but you can't put tags in it like <img> etc. So the images should be on a .html page (or .php or .shtml if you use that). CSS is only for changing the look of it :) I'm not sure if that will answer your questions though.

if the site you are having problems with is the site you PM'ed me then unfortunally i can't take a look at it right here (at school on the imac) because it totally crashed the computer. if it's NOT that page, then could you show us wich page you are having problems with with the background?

Love,
mirna

MaGiCSuN
02-18-2004, 01:27 PM
i believe geocities.com doesn't allow .css files.. however they do have it listed in the "supported filetypes" list. When i tested it on my geocities UK account i could 'view' the file and when i viewed it i saw the exact coding i typed inside the .css file. I don't believe that supposed to happen..

If you don't want to ' update' the css on all the pages when you change the layout the you could use SSI with it, that kind of works like an .css file:

open your filemanager and click on "new"
type in the field "filename" this: stylesheet.txt
in the big field you type all the css like this:


<style type="text/css"><!--
all css codes here
--></style>

then save it. Then check one of your pages, and click "edit". Remove the stylesheet betweeen the<head> and </head> and put in this line:

<!--#include virtual="stylesheet.txt" -->

so your head part should look like this (without all the other fancy codes you might have there):


<head>
<!--#include virtual="stylesheet.txt" -->
</head>


Now everytime you change stylesheet.txt ALL the pages you have that line on will be changed/updated.

For the background you should have this in your css:

body { background-image: url(URLOFIMAGEHERE.gif); }

and change the CAPITAL part to the filename of the image. Hope that helps a bit :) And about the crashing part: I don't know for sure if it was ONLY your page, it could also been that the system here just stopped doing good things or whatever.. and that your page was the last t hing i could open.. things are often like that here at school.. blah i hate imacs :P


Love,
Mirna

bourdelson
02-18-2004, 08:41 PM
i believe geocities.com doesn't allow .css files..

Just as a little helper note, geocities.com does support the .css files, because I link to an external style sheet on my geocities page. :)

fengshui37
02-18-2004, 10:01 PM
I know the CSS file works on geocities because my "link hover/color etc" stuff is working on the page I've been playing with. I think I needed to specify the background for each layout position. Gonna play with that on hard drive...since I shifted gears to an iframe (which I'm using there now and which calls a different html file to run within its boundaries)....I've changed the dynamics away from learning the css way of doing it. I'm hoping can specify different body and background for each page layout partition within the css layout (HA !)...we'll see. I'm so busy during week, dont have that much time to fool around with my web pages but before the weekend is out, I'll test it all and maybe shift to a better way !!

Page I'm playing with is at http://www.geocities.com/fengshui37

Current CSS file reads: (short and simple)
<style type="text/css">


A:link {color:#FFFFA0; text-decoration: underline; font-size: 14pt}
A:hover {color:#FFFF00; text-decoration: underline; font-style: italic; font-weight: bold; font-size: 14pt}
A:visited {color:#C3C505; text-decoration: underline; font-size: 14pt}

A.link2:link {color:#FFFFA0; text-decoration: underline; font-size: 9pt}
A.link2:hover {color:#FFFF00; text-decoration: underline; font-style: italic; font-weight: bold; font-size: 9pt}
A.link2:visited {color:#C3C505; text-decoration: underline; font-size: 9pt}

H1 {font-family: Amazone BT;
color: #FFFFC0;
font-size: 18pt;
font-weight: bold}

</style>

Intend to try to move the css in header from index page to the css page and ultimately eliminate the iframe on the index page; hopefully it will work within the css environment.

- Feng37

PS...again, thanks for all your hints and tips....some have really helped. I got the transparency stuff right first time for the iframe when I did it.

Neptune
02-18-2004, 10:07 PM
I use geocities and they let me use .css files :confusion. I have 'em all over the place.

Edit: Oops, just noticed bourdelson already said that (I read the post but thought you said they didn't. I read it over again and noticed my mistake). Sorry :blush:

Neptune
02-18-2004, 10:18 PM
I was reading everything again, and if you are using external css then you don't need the <style type="text/css"> and </style> pieces.

I've never heard of using anything like "A.link2:link ".

fengshui37
02-18-2004, 10:36 PM
That just sets up a separate set up rules for a different link i.e. most of my links were 14 pt but the ones for my counter which is outsourced to bloke.com were smaller so I set up the link, hover, visited properties for a smaller size for that particular link. Inside the <a> tag, add class="link2" to the information and it will take that section of information from the css definitions for that particular link. I could have universalized it by not specifying a font-size in the "a" definitions which is actually the way to go when I think about it in hindsight.

- Feng37

fengshui37
02-18-2004, 10:42 PM
At any rate, using the class= and naming separate sets of same attributes within the css adds additional power to style sheets but at the same time is making it more inefficient in that should only put "universal" items in there to allow maximum effect across (perhaps) a multiple of different html files (pages) by changing one file. Unless you have more than one specific style you want to use for different items within the same class (i.e. links, headers, etc) that may be present over a broad spectrum of different pages...then setting this up like that is still efficient.

- Feng37

e_curls
03-08-2004, 01:29 AM
[QUOTE=MaGiCSuN]

i believe geocities.com doesn't allow .css files.. however they do have it listed in the "supported filetypes" list. When i tested it on my geocities UK account i could 'view' the file and when i viewed it i saw the exact coding i typed inside the .css file. I don't believe that supposed to happen..

[/QUOTE=MaGiCSuN]

i'm currently on geocities and they do allow .css files ... it's saved me a lot of time....just so you know ...