let me know if I've got the concept?

brand new to this...

[coolo]

hello,
I've been reading the forum for about a week now, trying to grasp this CSS thing. The last time I did any web authoring work was back in 1997 and things have kinda changed since then. So, I have a basic HTML knowledge and am in the process of reading a book for beginners about PHP and MySQL.

Anyhow, my question is this. I want to set up two rows of images which are all identical in size, and which will span the entire page. And I want to make these images available on all of the pages in my site. I'm planning on using an external style sheet to set this up, but my question is this:

The images themselves do not sit in the external style sheet right? Just the formatting and placement of the images is described and I can call that specific formatting and placement when I place the images in the body. Does this sound correct?

For instance,
the .css file would have the following

img.topleft {
position: absolute;
top: 100px;
left: 6px
}

And the body of the .html file would have the following

<img class="topleft" src="/randomimage.gif" />

Does this sound about right?

[Purple Martin]

Yes, that's right. Images are displayed using HTML tags sitting in the HTML document. CSS styles are often kept separately in a .css file.

BUT - I'm not sure about your page design. Are all the images next to each other with no gaps? If so, think about what would happen if someone else has a monitor with different settings to yours. If their resolution is higher, your rows of images don't fill their screen width. If their resolution is lower, they get nasty horizontal scrollbars because the rows are too wide for their screen.

Try to design a page that is LIQUID - so it will expand/contract to suit the user's screen and browser size.

[coolo]

thank you for your input.

I am optimizing for an 800x600 resolution, and it should also look good at 1024x768. I'm kind of concerned about how the layout will look and would rather have it controlled instead of being fluid. I realize I may alienate a few surfers, but such is life. I'm not going to sweat it too much.

I'm sure I will be asking many more questions in the near future, so I do appreciate any input. I have been lurking here for a minute, and this seems to be a very friendly and informative spot. thanks again.

[Purple Martin]

One thing a lot of people do instead of going liquid is to have their page optimised for 800x600 (which in practise means fixing the content width at 750px to allow for scrollbars and window edges) and centering the content on the screen. Monitors with higher resolutions see the content down the middle with a bit of a gap either side, which looks OK (especially if the gap is a colour which fits the site's design).

[coolo]

yeah, that's exactly what I was planning on doing. I actually got the answer on how to do that in a different thread in this forum, and it works great. I've got my basic skeleton for the pages down. Now it's just about adding the details. thanks again.

[coolo]

ok, so after working with this for a while, and thinking about it for a bit, I am kind of confused. Now, I've got my CSS working great with an external style sheet, but if I want the navigational area of my page (which consists of a bunch of images) to remain constant from page to page, I'm going to be using the copy/paste functions a whole bunch. For some reason, I was under the impression that CSS would eliminate this. Am I using CSS wrong? Or do I have the whole concept of CSS wrong in my head? I don't know, everything seems to look good on the home page anyway...

[stever]

One of the most efficient ways of doing this using CSS (and a more search-engine-friendly method than images as links) is to use a single standard image as a background to text links.

Search for some threads here about CSS and styled lists - that's a popular way to do it for vertical navigation these days. Otherwise there are a couple of sites dedicated to this technique (easily found in your favourite search engine).

[SuzyUK]

coolo

I'm going to be using the copy/paste functions a whole bunch. For some reason, I was under the impression that CSS would eliminate this.

No CSS is not a scripting language it is for styling only.

I think what you require a SSI (server side include)function. You can still use CSS to style the page.

The PHP book you mention should be of help there but you can use ASP or your host may support SSI (.shtml pages).

Basically you put your nav (images) code into a seperate file (no <html>, <body>.. etc.. just the menu code) then in every page you want the nav to appear you insert the <include directive> of whatever scripting language you are using.. and the include of the menu code page actually takes place on the server when a page is requested.

Bit outside the scope of this forum, but if you've already got a PHP Book and your host supports PHP then.. check out the PHP Forum [webmasterworld.com]

Navigation using images as backgrounds is possible using CSS
this thread discusses a vertical navigation [webmasterworld.com] but it can be done horizontally too..

Suzy

[coolo]

haha, I should've thought of that myself SuzyUK. Thanks much for the input.