[Pro] Text Question

Hello

I am redoing a web site for my wife and having problems with text sticking inside the HTML box that it is drawn in.
The text overflows and blocks out the button underneath.
When the bottom two lines are compressed using the Leading command things work out and the button is not blocked.
This problem is only happening on her windows machine in Chrome not Explorer
I have checked it on several browsers on my Mac and it looks fine.
On the link listed below there is a black box drawn to show the height of the HTML box.

If anyone can tell what and why is happening that would be great.

Thanks Phil


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

Different browsers/operating systems display text at different sizes - Windoze generally larger.

Look at your page with Safari and under the View menu select Zoom Text Only. Now use Cmd+ to increase the text size (do it a couple of times while watching the page) - this simulates what other visitors will see.

Your page is constructed using Divs (CSS Layout) and as such each item on the page is independent of the others so an expanding text box can overlap a static image.

To avoid this try using the RPL action (Relative Page Layout) or you can construct your page using Table Layout which does not allow any 2 elements to occupy the same space on the page.

There are other methods including an inline layout but that takes more thought.

David


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

Hello David

On 26 Aug 2012, 10:20 pm, DeltaDave wrote:

Look at your page with Safari and under the View menu select Zoom Text Only. Now use Cmd+ to increase the text size (do it a couple of times while watching the page) - this simulates what other visitors will see.

How many people do this sort of thing. When I do this it knocks everything out of whack. Is it something to worry about?

On 26 Aug 2012, 10:20 pm, DeltaDave wrote:

Your page is constructed using Divs (CSS Layout) and as such each item on the page is independent of the others so an expanding text box can overlap a static image.

To avoid this try using the RPL action (Relative Page Layout) or you can construct your page using Table Layout which does not allow any 2 elements to occupy the same space on the page.

I have found the RPL action and will play around with tomorrow.

If I was to set the page up with Table Layout and someone enlarged the text, would the page in effect become a mess of items spread all over the page or do they just enlarge where they are and become difficult to read because the enlarged text is confined to a small area? I ask because when the site was setup originally I used RapidWeaver and trying this a few minutes ago resulted in exactly that happening. Never seen that before. Makes the site for lack of better words unreadable and unusable.

Phil


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

On Aug 26, 2012, at 7:32 PM, Phil Knight wrote:

Hello David

On 26 Aug 2012, 10:20 pm, DeltaDave wrote:

Look at your page with Safari and under the View menu select Zoom Text Only. Now use Cmd+ to increase the text size (do it a couple of times while watching the page) - this simulates what other visitors will see.

How many people do this sort of thing. When I do this it knocks everything out of whack. Is it something to worry about?

Nobody (well, very few people) do this. But what it simulates is the fact that different browsers and operating systems have different defaults for font sizes and line height. (And let’s not forget those with difficulty seeing, who may have tweaked their browser to show all the fonts much larger than normal.) Most modern browsers will zoom the entire page, graphics and all, when you enlarge the font size. But there are still older browsers that don’t. Anyway, the issue is that your page needs to gracefully put up with this abuse, and if you can stand up to a little text-only zooming, generally you can handle most anything that you might legitimately encounter.

On 26 Aug 2012, 10:20 pm, DeltaDave wrote:

Your page is constructed using Divs (CSS Layout) and as such each item on the page is independent of the others so an expanding text box can overlap a static image.

To avoid this try using the RPL action (Relative Page Layout) or you can construct your page using Table Layout which does not allow any 2 elements to occupy the same space on the page.

I have found the RPL action and will play around with tomorrow.

If I was to set the page up with Table Layout and someone enlarged the text, would the page in effect become a mess of items spread all over the page or do they just enlarge where they are and become difficult to read because the enlarged text is confined to a small area? I ask because when the site was setup originally I used RapidWeaver and trying this a few minutes ago resulted in exactly that happening. Never seen that before. Makes the site for lack of better words unreadable and unusable.

A table cell, unless it has been deliberately “frozen” with CSS to a particular dimension, will always expand to fit its contents if the contents are enlarged. Because a single table will always act as a monolithic structure, an expansion in one of the cells will push all other cells below that point down the page, allowing everything to show without overlaps. The only exception to this I can imagine is if you had drawn tables with the table tool while the page was in CSS Positioning mode. That would result in a number of DIV tags absolutely positioned on the page, each containing a table. The contents of each table would flex relative to their content, but because the parent DIVs were absolutely positioned, the DIVs might crash over one another.

If you start with a blank page, and you set the Layout button to Table Layout, anything you draw on the page will become a part of a master layout table. Any changes in the top of that table will push the rest of the table down to fit. It’s a more restrictive layout style (you can’t deliberately overlap two HTML items), but the result is 100% bulletproof in most browsers, regardless of font settings or zoom percentage.

Walter


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

Hello Walter

Your last paragraph was the answer I think I was looking for. Will try tomorrow and set the page up with the CSS button turned off.

Thanks
Phil


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