CSS Positioning....I think. - CSS forum at WebmasterWorld - WebmasterWorld

Forum Moderators: not2easy

Message Too Old, No Replies

CSS Positioning....I think.

Help?

lufflyanna

2:40 pm on Apr 25, 2003 (gmt 0)

10+ Year Member

Hi.
I'm having a problem positioning something, and no matter what I've tried, I can't get it to work. I'm kind of new to CSS and having a few problems.
So far I have this:
[url]snip[/url]
However, I'm trying to place another "box" so to speak underneath the one in the middle in that URL. But no matter how I try and position it, I can only get it in the top right instead of the bottom right like this:
[url]snip[/url]
I know currently that "box" is too big and doesn't fit right, but once I get the positioning correct I can edit that myself.

This is the coding..or whatever you want to call it I've got for that "box":

<div style="position:absolute; right: 5; top: 10px; bottom: 300; left: 300px; padding-left: 10px; padding-right: 10px; width: 560; height: 340; align="left">

<TABLE style="border: 0px #4C3B0A inset; padding: 0;" cellSpacing=0 cellPadding=0 width="560" height="340" valign="top" align="right"><TBODY><TR>

<TD style="background: url(http://www.boomspeed.com/lufflyanna/tabletwoo.jpg); padding-top: 0; padding-left: 0;" width="100%" valign="top" align="center">

And this is all after the rest of the coding for the parts on the first URL I put down.

I'd be greatful for any help at all... ;/

[edited by: heini at 3:26 pm (utc) on April 25, 2003]
[edit reason] sorry, no urls please / thanks! [/edit]

BlobFisk

3:23 pm on Apr 25, 2003 (gmt 0)

WebmasterWorld Senior Member

10+ Year Member

Welcome [webmasterworld.com] to WebmasterWorld, lufflyanna!

From what I can tell you are trying to achieve a fluid design, with a fixed left navigation and the fluid right content area?

Firstly, I think that the approach you are using is very complicated, and you can achieve the same results with more simple and succint code. Have a look at the bluerobot and glish sites to see if the layouts they give there would suit you. You could then use one of these as a foundation for your page.

A few notes on your code:

You should always assign a unit to your CSS values
Some of your layers seem to be on top of each other, thus obscuring the content of the layers below them
Try to avoid using deprecated tags, like font. Try to use pure CSS instead - check out Nick_W's superb series of CSS tutorials here [webmasterworld.com]. An invaluable knowledge base and CSS starting point.

However, the answer to your question is that you are hiding the image by placing another layer over it - you could use the one layer (the one that currently holds the image) for all content.

Hope this helps and if you have any other questions, please don't hesitate to ask!

Quark

12:24 am on Apr 27, 2003 (gmt 0)

10+ Year Member

Hello,
I just wanted to say that I've been enjoying reading these threads on CSS and Usability. I'm gearing up for a new project. My church wants a redesign of their site. I'll be coming back here more often. Thanks for such a great resource.
Quark

BlobFisk

3:41 pm on Apr 28, 2003 (gmt 0)

WebmasterWorld Senior Member

10+ Year Member

Hi lufflyanna,

How are you faring with your project? Have you ironed out the problems you were having? Anything else we can help you with?

Quark: Best of luck with your new project too!

lufflyanna

8:36 pm on Apr 28, 2003 (gmt 0)

10+ Year Member

Hi...

I've decided to start from the beginning again. I'm reading the CSS Crash Course that you provided in your first reply.

I don't understand however where (in the crash course) it talks about putting for example, <div id="content"> blah blah, into my HTML, and then putting the other part in the CSS...I've been working all in one like..document. Starting with: <head> etc etc...I don't know. I think I'm missing something...maybe a brain. ;p

Nick_W

8:41 pm on Apr 28, 2003 (gmt 0)

WebmasterWorld Senior Member

10+ Year Member

Hi, The different ways of implememting styles are contained in the introductory part of the course:

[webmasterworld.com...]

If you have any problems with course please post in the course threads themselves, it just keeps things neat and tidy ;)

Nick