Div and background problems

K

Kris

Hello,

I've been working on my site a lot and I think it is much improved. There
are still two problems with the main page that are driving me nuts. The
first is that I cannot figure out how to get my div elements to have a
height equal to the entire screen. The solution I've seen for this is to
just set the page background color to the same background color as the
shorter div element, and it will appear that the columns of color extend the
full length of the page. In my situation, I hope to use this same layout
for many different pages. Since the content is different, one page may have
the navigation column as the longest column while another has the content
column as the longest column. This prevents the solution of setting the
page's background color from working. Is there any way to tell a div
element to extend the full length of the page? I have tried using the
height property, but it only seems to accept exact lengths and not percents.

The other problem I am having is that my background image is no longer
centered under the content. I want it to be fixed and centered, but it
needs to be centered on the content and not the entire page. How do I add a
left offset to the background image when it's fixed?

Also, I read somewhere that using the div tag in the way that I am is not
good practice. This was before I was actually using the div tag, so I
didn't read it too closely, but the idea was something like that's not the
intended purpose of the div tag and won't work on all browsers. If that's
true, then what alternative do I have? I already tried doing this layout
with a table and that was a mess.

For those who read my last post, I have given up on the fixed nav-bar. It
just caused more problems than it solved, particularly with low screen
resolutions. You can see my current page here:

http://hedgemaze.2y.net:3000/main3.html

Thanks in advance!

Kris
 
B

Beauregard T. Shagnasty

Kris pounced upon this pigeonhole and pronounced:
Hello,

I've been working on my site a lot and I think it is much improved.

For those who read my last post, I have given up on the fixed nav-bar. It
just caused more problems than it solved, particularly with low screen
resolutions.

Screen resolutions are unimportant. See:
http://allmyfaqs.com/faq.pl?AnySizeDesign

"So there are two accurate answers to "Which resolution should I design
for?":

* All of them
* None of them

You must have introduced other problems. See my Firebird view:
http://home.rochester.rr.com/bshagnasty/images/infoarmory.jpg

Hopefully before you are finished, there will be a <title> element.

You still have some errors. See: http://validator.w3.org/

A fixed-position nav-column is not difficult, if you ignore IE.

Your background image is way too bright and interferes with the reading of
the content.
 
K

Kris

Kris pounced upon this pigeonhole and pronounced:



Screen resolutions are unimportant. See:
http://allmyfaqs.com/faq.pl?AnySizeDesign

"So there are two accurate answers to "Which resolution should I design
for?":

* All of them
* None of them


You must have introduced other problems. See my Firebird view:
http://home.rochester.rr.com/bshagnasty/images/infoarmory.jpg

Hopefully before you are finished, there will be a <title> element.

You still have some errors. See: http://validator.w3.org/

A fixed-position nav-column is not difficult, if you ignore IE.

Your background image is way too bright and interferes with the reading of
the content.

Oops. I did forget the <title>. I'm converting this from a page that used
frames. That will get added in before I'm done.

I think screen resolution does matter when you're using a fixed nav bar
because if the nav bar gets too long and goes off the page there is no way
the user can see the bottom of it. That's the error I'm trying to avoid by
simply switching to a normal nav bar.

I think I know why the page is displaying incorrectly in your browser. For
some reason the margin of the content section is being displayed on top of
the nav bar. This error originally showed up as the content text being on
top of the nav bar, and I fixed it by adding a left margin. The nav bar
shows through just fine with Safari. Since it doesn't work on your browser
I'm guessing that adding a margin was not the right way to fix that. How
should I do it?

The background image looks fine to me, but almost everyone who has commented
on the page has said they can't read the text over it, so I will fade it out
some more.

Thanks for your feedback.
 
K

Kris

Oops. I did forget the <title>. I'm converting this from a page that used
frames. That will get added in before I'm done.

I think screen resolution does matter when you're using a fixed nav bar
because if the nav bar gets too long and goes off the page there is no way
the user can see the bottom of it. That's the error I'm trying to avoid by
simply switching to a normal nav bar.

I think I know why the page is displaying incorrectly in your browser. For
some reason the margin of the content section is being displayed on top of
the nav bar. This error originally showed up as the content text being on
top of the nav bar, and I fixed it by adding a left margin. The nav bar
shows through just fine with Safari. Since it doesn't work on your browser
I'm guessing that adding a margin was not the right way to fix that. How
should I do it?

The background image looks fine to me, but almost everyone who has commented
on the page has said they can't read the text over it, so I will fade it out
some more.

Thanks for your feedback.

Actually I think I may have just found a fix for the bug you saw. I used
position-absolute and left: 9.5em instead of the padding-left: 120px. It
seems to display exactly the same thing here. Would you mind trying it
again with your browser and telling me if it worked? I have updated the
page at the same address above, so that's the newest copy now. I also fixed
that image. I hope it's good this time!

Assuming those are both ok I still need to fix the column heights and the
background position. Web design is so much work... :)

Thanks again.
 
B

Beauregard T. Shagnasty

Kris pounced upon this pigeonhole and pronounced:
On 10/3/03 2:11 PM, in article BBA3342B.D0D6%[email protected], "Kris"
<[email protected]> wrote:

Actually I think I may have just found a fix for the bug you saw. I used
position-absolute and left: 9.5em instead of the padding-left: 120px. It
seems to display exactly the same thing here. Would you mind trying it
again with your browser and telling me if it worked? I have updated the
page at the same address above, so that's the newest copy now. I also fixed
that image. I hope it's good this time!

Yes, that fixed the problem of the covered nav section. Looks ok now.

Since you're dropping the frames, don't forget to drop the target="main"
in your nav list, which now is opening new windows.

I think the background sheild is still too bright said:
Assuming those are both ok I still need to fix the column heights and the
background position. Web design is so much work... :)

Aye, but it's fun work.
 

Ask a Question

Want to reply to this thread or ask your own question?

You'll need to choose a username for the site, which only take a couple of moments. After that, you can post your question and our members will help you out.

Ask a Question

Members online

Forum statistics

Threads
473,731
Messages
2,569,432
Members
44,832
Latest member
GlennSmall

Latest Threads

Top