T
T.J.
Hi,
How can I fix the font size for one
particular piece of text when
displayed in FireFox?
TIA.
How can I fix the font size for one
particular piece of text when
displayed in FireFox?
TIA.
T.J. said:How can I fix the font size for one particular piece of text when
displayed in FireFox?
T.J. said:How can I fix the font size for one
particular piece of text when
displayed in FireFox?
How can I fix the font size for one
particular piece of text
when
displayed in FireFox?
Barbara de Zoete said:Why would you want to do that?
Why especially for FireFox?
It is usually best to provide a relative font for all your text. If _you_
experience a certain part of your content to have a too large font-size in
FireFox, change the size in _your_ browser settings.
Because I want a very prominant header, so are using 40px
as my <h1> tag whilst all other font is relative.
if the header gets any bigger than 40px it starts effecting the
layout.
That was the only one I had tested it on at the time, I now see
Netscape does the same thing.
The key word being "usually" are there never exceptions to the rule?
All other text on the page is relative.
This is the page if interested,
http://www.sim64.co.uk/ordering-roses-online.html
Ideally I want the text of the main header all on one line, and not
cause the page to expand.
In IE with the font fixed it displays as planned, but because the text
size changes with Firefox and Netscape it causes the second line of
text to drop.
Because I want a very prominant header, so are using 40px
as my <h1> tag whilst all other font is relative.
if the header gets any bigger than 40px it starts effecting the
layout.
Barbara de Zoete said:Yes, there can be.
You just explained one. If you want to prevent wrapping of the header in
_all_ situations, I would use an image. If it shouldn't wrap in
relatively common browsing situations, but you don't care for viewports
under a certain width (say 760px), I would use the child selector to
specify a font-size especially for browsers other than IE. IE doesn't
understand the child selector properly and ignores rules set with them
(for example):
h1 {
font-size:40px; }
body>h1 {
font-size:36px; }
Duende said:While sitting in a puddle T.J. scribbled in the mud:
make it an image
Mitja said:Because I want a very prominant header, so are using 40px
as my <h1> tag whilst all other font is relative.
if the header gets any bigger than 40px it starts effecting the
layout.
To fix the font size, your only option are images. NOT recommended.
The other, better and more obvious way is to fix (as in mend, not make
unresizable) the layout itself.
[looks at html code]
Hmmmm, seems alright. In what way does the layout break? You mentioned
"dropping" lines - do you mean wrapping or disappearing? If it's
disappearing, I haven't looked good enough. If it's merely wrapping, don't
worry, live with it Wrapping is still better than disappearing off the
right edge due to not wrapping. Web design can never be all that exact and
retain proper flexibility at the same time.
Just in case you're interested - in Opera it wraps in two lines with my
default settings, as it does in Firefox. There are other things that do
need fixing, though. Try maxing the text smaller and see what happens
(hint: "clear: left").
Is creating an image the only other answer. I thought this was
always frowned upon too?
Thanks,
But I like to make my pages at least Bobby 508 approved
if I put h1 {font-size:36px; } in the body, Bobby will call it as
an error. Or have I read your reply wrong?
Barbara de Zoete said:[ problems with header of 40px wrapping in FireFox, unwanted ]
Thanks,
But I like to make my pages at least Bobby 508 approved
if I put h1 {font-size:36px; } in the body, Bobby will call it as
an error. Or have I read your reply wrong?
Well, maybe. Maybe I wasn't clear enough. In any case we don't seem to be
able to understand eachother with ease
What I mean is that these above codes are put in your stylesheet. The h1
is a normal selector (element level). The body>h1 is a child selector.
The styles described will only apply to the h1 being the direct
descendent, the child of the body. So:
<html>
<head>
<style type="text/css">
h1 { font-size:40px; }
body>h1 {font-size:36px; }
</style>
</head>
<body>
<h1>Your header here</h1>
<p>This above header will have 40px font-size in IE
and 36px font-size in all other mainstream, modern,
graphical browsers.</p>
</body>
</html>
This is about as clear as I can be. ;-)
[image versus fixed font-size]
As a rule of thumb I would stick to flexible design, in this case meaning
a fixed font-size for the header (if large enough), so the text in some
browsing situation will wrap. Always preferable over an image only
showing partially, for than the contents of the page header might get
lost. That I would regard highly undesirable.
But, it is your descission. Just think it through and be consistant with
the implementation of the technique you choose throughout your site.
Barbara said:If you want to prevent wrapping of the header in _all_
situations, I would use an image.
T.J. said:This is the page if interested,
http://www.sim64.co.uk/ordering-roses-online.html
Ideally I want the text of the main header all on one line, and not
cause the page to expand.
T.J. said:Hi,
How can I fix the font size for one
particular piece of text when
displayed in FireFox?
Neal said:It is absolutely stupid to want to. It goes against every benefit the WWW
has going for it.
Now go. Go far away.
n|ck said:The div that contains your <h1> only has a width of 390px - If you
increase that, it should take longer for the <h1> to wrap.
T.J. said:Because I want a very prominant header, so are using 40px
as my <h1> tag whilst all other font is relative.
if the header gets any bigger than 40px it starts effecting the
layout.
Ideally I want the text of the main header all on one line, and not
cause the page to expand.
In IE with the font fixed it displays as planned,
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.