In article <7d2529a6f6e05@uwe>,
"LayneMitch via WebmasterKB.com" <u39402@uwewrote:
dorayme wrote:
Apart from any fancy device to help you see what other users are
seeing, you can use your own eyes and fingers. Just alter your
own browser width and use the text-size controls to see what
happens. Just remember that not everyone is seeing things at the
text and window sizes you are seeing.
Okay...
I see what you're saying.
Even though I'm new...my problem isn't with positioning...(anymore)
My problem is knowing how to properly display a background or how to display
a background image that I've designed in Photoshop. This is where advice
would greatly help.
I just experimented with resizing everything.
I got rid of all of my images and text and had just the blue rectangular
background. And I tried resizing by hitting Ctrl +... and nothing happened.
I'm thinking that this is what's effecting my entire design - the
unflexibility of my background.
Basically....how do you design a background graphic in photoshop and display
it properly as a background in CSS so resizing won't be a problem?
Well, my point about Ctrl + was simply to see what happened in
your previous design. I described what happened.
However, you need some text or inline images before "something
happens" Why with inline images but no actual text? Well, I guess
because they are in a line that *could* share text. The text
could be big or small depending. The invisible line blocks are
sized according to the biggest of any inline objects. The browser
just makes provision. If the text size is 100%, then pictures
that are taller than such normal text will make the line box
taller. But at some enlargement of the text (or potential text)
the line box will be taller than the pics.
The text size is sized according to what the author says it
should normally be or as it is overridden by the user wanting it
bigger or smaller.
You can see for yourself. Get rid of all your images bar one in
the previous url you provided. Put:
<div class="linkbkgd" style="background: white;">
<img src="images/Link-Background.gif" alt="">
</div>
And watch the action. The space under the image is for the
descenders in text.
As for displaying bg images, that is simple enough. Read the
htmldog link I gave. Read what rf says.
You may be thinking you can stretch a bg image or make it grow
with the growth in an element (as happens in text size
adjustments). But you can't. You can give an illusion by having a
bg repeat itself, or you can have one so big that some of it
(though not all) will practically fill the element.
--
dorayme