Using CSS for gallery links...?

[charon2112]

Hello everyone, I'm trying to put together a photography website for myself. I'm new to CSS and can't figure out how to have three images, in a horizontal row in the center of the page for links to three galleries. I'm sure the answer is simple, but I've searched around and can't find a solution. I would like the placement of the three images to scale depending on the size of the window, and would like them to almost fill the window left to right...

I would never ask anyone to write any code for me, but a nudge in the right direction would be appreciated..

Thanks. :)

[ray326]

There's no good way to scale them. It's best to pick some minimal browser width you expect to support and do the layout for that, centering the image menu container.

[charon2112]

Okay.

Thanks Ray...:)

[Centauri]

Not sure from your post whether you want the images themselves to scale, or just the positioning to be fluid. As Ray said, scaling the image size in the browser is a bad idea, especially for a photographic site, as it reduces image quality.

If you design for a minimum 800x600 resolution you will have around 770px of width to play with, therefore each image could be 256px wide. The links themselves could be marked up in the html as an unordered list, with the <a> elements sized to the graphics and the graphics applied as background images to the <a> elements via css. The left and right links can be floated left and right, whilst the other is centred, thereby fluidly expanding with screen width. If the whole site is contained within a container with a percentage width set, then the link spacing won't seem so abrupt.

[charon2112]

Thanks...!

I was just talking about fluid positioning of the images, not the size of the images.

Not sure from your post whether you want the images themselves to scale, or just the positioning to be fluid. As Ray said, scaling the image size in the browser is a bad idea, especially for a photographic site, as it reduces image quality.

If you design for a minimum 800x600 resolution you will have around 770px of width to play with, therefore each image could be 256px wide. The links themselves could be marked up in the html as an unordered list, with the <a> elements sized to the graphics and the graphics applied as background images to the <a> elements via css. The left and right links can be floated left and right, whilst the other is centred, thereby fluidly expanding with screen width. If the whole site is contained within a container with a percentage width set, then the link spacing won't seem so abrupt.