/    Sign up×
Community /Pin to ProfileBookmark

Postion of text in page layout?

Does anyone know how to “lock in place” the position of html text on a webpage? I’m referring to text that has been positioned where I want it on the page using layout tables and cells. I’m making it so the text is of fixed pixel size—so that the text always will appear the same size—regardless of which “text size” (smallest, smaller, medium, larger, largest) is the current setting on a typical web browser.

The way I’m making text on a webpage stay fixed at a certain pixel size is by using the following code in a page’s head section:

<head>

<style type= “text/css”>

.bodytext {font size: 15px}

.heading {font size: 19px}

</style>

</head>

Each line of text in the body of the page can have these classes (“bodytext” or “heading”) applied to them. The result is that the size of the text always stays the same when viewed through a browser. However, when a user tries different text size settings on the browser, the position of the lines of text still changes with each setting. The best way to see what I’m talking about is to look at this example at [url]www.lakeinthewoods.org.[/url] Try adjusting the text size to different settings—you’ll see that the position of the text on the homepage jumps around, it doesn’t stay “locked” in the middle.

If you check out [url]www.cnn.com[/url] or [url]www.si.edu.[/url] you’ll see that no matter what text size setting you try, the size and position of all text on the page stays locked in place–exactly where the designer meant it to be. This is what I am trying to achieve. How is it done?

Maybe the way to do this involves using css exclusively, and not working with html tables and cells?

Thanks,
Chris Flanders
[email][email protected][/email]

to post a comment
HTML

4 Comments(s)

Copy linkTweet thisAlerts:
@pyroNov 10.2003 — [i]Originally posted by Luther [/i]

[B]If you check out www.cnn.com or www.si.edu. you'll see that no matter what text size setting you try, the size and position of all text on the page stays locked in place--exactly where the designer meant it to be. This is what I am trying to achieve. How is it done?[/B][/QUOTE]
You're only bet is to use IE, as that is that is the only current browser that I know of that does not allow text zooming on pixel fonts. Also, it'd be best to not wish for that anyway, as the reason brwosers allow users to resize text is for accessibility reasons.
Copy linkTweet thisAlerts:
@96turnerriNov 10.2003 — that is true, come on ryan when ryanbrill.com gona be changed i wana see what it gona look like lol, dont suppose you can give me a sneak preview? :p
Copy linkTweet thisAlerts:
@pyroNov 10.2003 — [i]Originally posted by 96turnerri [/i]

[B]that is true, come on ryan when ryanbrill.com gona be changed i wana see what it gona look like lol, dont suppose you can give me a sneak preview? :p [/B][/QUOTE]
It has been changed... ?

The "coming soon" was changed to "coming very soon" on Friday. It could read coming very, very soon, now... ?
Copy linkTweet thisAlerts:
@96turnerriNov 10.2003 — ok didnt notice that, ill let you off :p , guess ill have to wait a few days then, mite start working on my personal site in the mean time
×

Success!

Help @Luther spread the word by sharing this article on Twitter...

Tweet This
Sign in
Forgot password?
Sign in with TwitchSign in with GithubCreate Account
about: ({
version: 0.1.9 BETA 5.20,
whats_new: community page,
up_next: more Davinci•003 tasks,
coming_soon: events calendar,
social: @webDeveloperHQ
});

legal: ({
terms: of use,
privacy: policy
});
changelog: (
version: 0.1.9,
notes: added community page

version: 0.1.8,
notes: added Davinci•003

version: 0.1.7,
notes: upvote answers to bounties

version: 0.1.6,
notes: article editor refresh
)...
recent_tips: (
tipper: @AriseFacilitySolutions09,
tipped: article
amount: 1000 SATS,

tipper: @Yussuf4331,
tipped: article
amount: 1000 SATS,

tipper: @darkwebsites540,
tipped: article
amount: 10 SATS,
)...