html text box BG color and width and changing text size in browsers

Is there any way to make an html text box with a background color grow in width when you increase the default text size in a browser? I can’t figure it out. Parts of the text grow beyond the bounds of the box with places it outside the BG color.

Thank you.


freewaytalk mailing list
email@hidden
Update your subscriptions at:
http://freewaytalk.net/person/options

To completely solve this problem, you need to search this list for articles about inline or “box-model” layouts. But if your page design is simple enough, you can get a lot of mileage out of unchecking the height attribute on your HTML box. This will allow it to flex vertically to fit the height of its contents. For horizontal stretchiness, it’s a little more complex.

Walter


freewaytalk mailing list
email@hidden
Update your subscriptions at:
http://freewaytalk.net/person/options

Thanks, Walter. I do use inline items. I have height unchecked for most boxes, but the fonts spread out beyond the background color when I increase the font size in my browsers. Firefox and Safari.

I’ve been so focused on one thing that I didn’t realize something, A regular sentence or paragraph will stay within the box just fine, it’s list items or single words that do this. Hmm. I just went to the Softpress home page and their list items in the top menu do spread out when zoomed with Safari. How is that done, I wonder.

Take a look at this page I’m working on. When I increase the font size in Safari or Firefox (or zoom with Safari) the text moves beyond their background. Is there a way I can prevent this from happening?

I noticed that increasing the font size (not zooming) on the Softpress site has no real affect. They must disable that somehow. We have a lot of visually impaired visitors to the site I’m trying to redsign so I can’t do that.

http://www.northcoastsoundsystem.com/memoirs.html

Thanks for any help.


freewaytalk mailing list
email@hidden
Update your subscriptions at:
http://freewaytalk.net/person/options

I think the effect on the Softpress site has more to do with the fact
that they are setting their menu to horizontal rather than vertical
(stacked) as you have it.

I don’t believe that the CSS Menus action changes the horizontal
measurement of the menu area from pixels to ems when it’s used
vertically, but it does when it’s used horizontally.

That’s the reason everything stays together on the Softpress site –
as the size of the font increases, the same metric (one em or one X
width of the M character at that particular font size) is used to set
the dimensions of the container object. Thus zooming the text (in any
way you like) will always keep the dimensions of the object in scale.

Walter

On May 13, 2009, at 10:18 AM, wurliuchi wrote:

I’ve been so focused on one thing that I didn’t realize something,
A regular sentence or paragraph will stay within the box just fine,
it’s list items or single words that do this. Hmm. I just went to
the Softpress home page and their list items in the top menu do
spread out when zoomed with Safari. How is that done, I wonder.

Take a look at this page I’m working on. When I increase the font
size in Safari or Firefox (or zoom with Safari) the text moves
beyond their background. Is there a way I can prevent this from
happening?


freewaytalk mailing list
email@hidden
Update your subscriptions at:
http://freewaytalk.net/person/options

Ah, enlightenment. Thank you, Walter. That explains it because Softpress was using vertical menus before on their their site and their menus exhibited the same problems as mine do now.

BTW, I really like, and get a lot of use of, your rounded corners action. Thanks for that.


freewaytalk mailing list
email@hidden
Update your subscriptions at:
http://freewaytalk.net/person/options