Vertically aligning text, works in IE not Firebird!?

[C.W]

I have a top box element that houses the web site title:

#top_section {
height: 20px;
padding: 10px;
text-align: left;
background: navy;
color: white;
}

then the font details for the title:

.top_title {
font-family: Georgia, Times New Roman, serif;
font-weight: bold;
font-size: 160%;
letter-spacing: 0.5em;
color: #F0E68C; /* Khaki */
}

Then in the index.html I have:

<div id="top_section">
<p class="top_title">My Website Title</p>
</div>

Now it looks fine in IE6 i.e. navy coloured box with the text in th
middle but in Firebird (Mozilla) the box is ok but the text is on th
bottom, half inside the box half outside.

Can't figure out why, the code seems ok, can anyone help?

Thanks

C.W
-----------------------------------------------------------------------
Posted via http://www.forum4designers.co
-----------------------------------------------------------------------
View this thread: http://www.forum4designers.com/message37059.htm

[Martin Honnen]

C.W wrote:

then the font details for the title:

top_title {

That selector applies to
<top_title>
elements, maybe you want
p.top_title
--

Martin Honnen
http://JavaScript.FAQTs.com/

[Christoph Paeper]

*Martin Honnen*:

C.W wrote:

top_title {

That selector applies to <top_title> elements, maybe you want p.top_title

Or "h1".

--
"The scientific name for an animal that doesn't
either run from or fight its enemies is lunch."
Michael Friedman

[Stanimir Stamenkov]

/C.W/:

I have a top box element that houses the web site title:

#top_section {
height: 20px;
[...]
}
[...]
font-size: 160%;
[...]

Now it looks fine in IE6 i.e. navy coloured box with the text in the
middle but in Firebird (Mozilla) the box is ok but the text is on the
bottom, half inside the box half outside.

Can't figure out why, the code seems ok, can anyone help?

Remove the 'height: 20px' declaration.

--
Stanimir

[C.W]

Thanks for the reply but I don't quite follow?

The code seems ok, what would you replace

C.W
-----------------------------------------------------------------------
Posted via http://www.forum4designers.co
-----------------------------------------------------------------------
View this thread: http://www.forum4designers.com/message37059.htm

[Christoph Paeper]

*C.W*:

The code seems ok, what would you replace?

<p class="top_title">

smells like it really wants to be a true heading, probably 'h1'. Also

<div id="top_section"><p class="top_title">

looks like bad style, but needn't be. Assuming the 'div' is required for
some reason (your CSS didn't look like it),

<div id="top"><p class="title">

seems to be more appropriate with a little more complex CSS selectors:

div#top { /* or just #top ... */}
#top .title { /* or div#top p.title ... */ }

Note the varying specifities.

--
"The squeaking wheel doesn't always get the grease.
Sometimes it gets replaced."
Vic Gold

[Alan J. Flavell]

On Sun, 25 Jan 2004, C.W blurted out, apparently to no-one in
particular and without any kind of context:

Thanks for the reply but I don't quite follow?

This is no way to conduct a usenet discussion. I'm killfiling
forum4designers.com now. If you want to participate in Usenet
groups, you're very welcome to do it properly.

[Brian]

C.W wrote:

I have a top box element that houses the web site title:

#top_section {
height: 20px;
Don't size elements in pixels unless the element will contain fixed
size content, e.g. an image.

height: 5em; /* change to suit your needs */
top_title {
font-size: 160%;
This is the correct way to size text.
<p class="top_title">My Website Title</p>
This is not a paragraph, so don't mark it up as such.

<div class="siteLogo">My Website Title</div>

It may be more appropriate as a heading on the home page.

<h1 class="siteLogo">My Website Title</h1>
Now it looks fine in IE6 i.e. navy coloured box with the text in the
middle but in Firebird (Mozilla) the box is ok but the text is on the
bottom, half inside the box half outside.
The title text, correctly sized in percent, does not fit in the fixed
size container. If you size the container correctly, in a flexible
unit (em units, as above), then the title will fit.
Posted via http://www.forum4designers.com

Posted *via* the web forum, but you're posting *to* a usenet group. So
please follow the conventions of this usenet group. Thank you.

--
Brian (follow directions in my address to email me)
http://www.tsmchughs.com/

[Unregistered]

Stanimir:
Ok can't get rid of the height because if I do the top header bo
height shrinks to fit the text which I don't want. I'd like the box t
be slightly bigger than the text.

Christoph:

Tried your suggestion and it does exactly the same, in fact looking a
it, your suggestion just seems to be name changes, thanks anyway.

I've tried a different approach, see what you think:

CSS:
#top_section {
height: 40px;
text-align: left;
background: navy;
color: white;
}

#top_section h1 {
font-family: Georgia, Times New Roman, serif;
font-weight: bold;
font-size: 160%;
letter-spacing: 0.5em;
color: #F0E68C; /* Khaki */
margin: 10px
}

html:
<div id="top_section">
<h1>The Art Of Getting CSS to Work!</h1>
</div>
Is that a better method? I've done away with padding and used margi
instead, also went with Christoph's idea of using the h1 tag.

However still getting problems. Again looks fine in IE6 but Firebir
refuses to recognise the top margin but left margin is ok?
So it budges it to the left but it's still stuck to the roof of th
box

Unregistered
-----------------------------------------------------------------------
Posted via http://www.forum4designers.co
-----------------------------------------------------------------------
View this thread: http://www.forum4designers.com/message37059.htm

[Barbara de Zoete]

Unregistered wrote:

I'd like the box to
be slightly bigger than the text.
That's what padding is for. It creates a distance between the border of
the box and the content of the box, so the box is slightly bigger than
the text.
CSS:
#top_section {
height: 40px;
text-align: left;
background: navy;
color: white;
}
Loose the height and put in padding:0.5em 0; /*or something*/
html:
<div id="top_section">
<h1>The Art Of Getting CSS to Work!</h1>
</div>
Why not combine the two in to one:

CSS:

h1#top {
text-align:left;
background:navy;
width:100%;
font-family: Georgia, Times New Roman, serif;
font-weight: bold;
font-size: 160%;
letter-spacing: 0.5em;
color: #F0E68C; /* Khaki */
margin: 10px;
padding:0.5em 0; /*or something*/ }

HTML:

<h1 id="top">Get some idea on how padding and margin work together</h1>

See <http://www.w3.org/TR/2002/WD-CSS21-20020802/box.html#mpb-examples>
Is that a better method? I've done away with padding and used margin
instead, also went with Christoph's idea of using the h1 tag.

However still getting problems. Again looks fine in IE6 but Firebird
refuses to recognise the top margin but left margin is ok?
So it budges it to the left but it's still stuck to the roof of the
box!
Use padding-top:0.5em; /*or something*/
Unregistered -
--------------------------------------------------
Posted via http://www.someforum4dezignorso.invalid

Get something decent to participate in usenet groups.

--

Barbara

http://home.wanadoo.nl/b.de.zoete/html/weblog.html
http://home.wanadoo.nl/b.de.zoete/html/webontwerp.html

[C.W]

Brian wrote:

*
Posted *via* the web forum, but you're posting *to* a usenet group
So
please follow the conventions of this usenet group. Thank you.
*

Apologies but I have no idea which usenet group I'm even posting to
Unfortunately www.forum4designers.com has left out that small detai
(unless I'm going blind).

Also if you could point out which conventions I've 'broken' I'll mak
sure I don't do it again.

Thanks

C.W
-----------------------------------------------------------------------
Posted via http://www.forum4designers.co
-----------------------------------------------------------------------
View this thread: http://www.forum4designers.com/message37059.htm

[Brian]

Alan J. Flavell wrote:

On Sun, 25 Jan 2004, C.W blurted out, apparently to no-one in
particular and without any kind of context:

Thanks for the reply but I don't quite follow?

This is no way to conduct a usenet discussion. I'm killfiling
forum4designers.com now. If you want to participate in Usenet
groups, you're very welcome to do it properly.

I've said this elsewhere (alt.html?): these "web forums" -- often
passing off usenet content as their own, and providing a misleading
interface -- threaten to overwhelm the usenet groups that they provide
access to.

--
Brian (follow directions in my address to email me)
http://www.tsmchughs.com/

[Brian]

C.W wrote:

Apologies but I have no idea which usenet group I'm even posting to.
comp.infosystems.www.authoring.stylesheets
Unfortunately www.forum4designers.com has left out that small detail
Indeed, they are passing off usenet content as their own. It is
unethical if you ask me.
Also if you could point out which conventions I've 'broken' I'll
make sure I don't do it again.

On this message, you quote me and provided attribution. *Thank you*.
That is rare from forum4designers. In another message in this thread,
you did not. When you don't quote, it makes it difficult to follow the
thread.

Some additional pointers:

http://www.cs.tut.fi/~jkorpela/usenet/

You many wish to get a news reader and read this and other
comp.infosystems.www.authoring.* groups directly. For one thing, it is
faster. And it will give you a better idea of the threads. Besides,
Alan Flavell, a knowledgeable regular here, has just announced that
he's killfiling messages from that forum because its users don't know
how to meaningfully participate in usenet.[1] And I suspect that
others may follow suit. If so, the responses you get to queries posted
there may not receive the attention they would in usenet proper.

1. If anyone goes to the forum, you'll see why its participants post
the way they do. The interface is misleading, and there's no mention
of it being an access point to usenet.

--
Brian (follow directions in my address to email me)
http://www.tsmchughs.com/

[Harlan Messinger]

"C.W" <Gu**********@mail.forum4designers.com> wrote in message
news:Gu**********@mail.forum4designers.com...

Thanks for the reply but I don't quite follow?

The code seems ok, what would you replace?

Your style that starts

top_title {

would be applied to an element that looks like

<top_title ... >...</top_title>

You don't have one. You have an element that looks like this:

<p class="top_title">My Website Title</p>

If your style is meant to be applied to elements with class="top_title", it
has to say so:

.top_title {

[Iain Hallam]

Brian wrote:

1. If anyone goes to the forum, you'll see why its participants post
the way they do. The interface is misleading, and there's no mention
of it being an access point to usenet.

Announcement from administrator in forum 29 at the forum4designers site
(which I just visited to see what people were talking about):

-- Quoted post --
Attention Dear Forum4Designers members!
We now offer an easy access to public usenet newsgroups that are related
to web design
The usenet has been around long before the web browser was even
invented. Today, hunders of thousands of people from around the world
still use public newsgroups as a way to communicate.

Just like groups.google.com our web based access add benefits to users
and usenet community. Here are just a few benefits:

Questions are answered faster because they are seen by many thousands of
people all over the net, not just by visitors or one website.

A forum based Search engine makes it easy to find topics
Filter makes it possible to block offensive languate and spam
Not everyone has direct usenet access because not all ISP provide it and
not all users are interested in setting up outlook express for access.

Additional security for users because they don't need to register to
read the posts.

Threads/posts are displayed in a forum format that most users are
familiar with.

Web Based usenet access opens the doors to the wonderfull world of
Usenet to new users that may not even know about usenet's existance.
This in turn add more activity to usenet groups, therefore benefiting
not only those using our website but also the rest of the usenet
community by making their groups more active.
A few things to remember when posting and reading posts:

Messages posted in these forums will also be uploaded to the usenet
newsgroups that these forums mirror while messages posted to usenet
newsgroups will also be downloaded to these forums (we will try to
synchronize our forums with usenet every hour)

These forums are not limited just to Forum4designers.com members
anymore! Now tens of thousands of people from around the world will be
able to see your posts, reply to your posts and you will be able to
reply to theirs!

Please remember a couple things:

First – posts you see in these forums are made by people other than
forum4designers.com members. You may see someone using inappropriate
language or flaming the forum. Remember – most of these people are not
our members and we don’t moderate these forums! Hey, we can’t moderate
the Internet!

The good news is that our forum censorship filters still apply and some
bad words will be replaced with XXXXXX.
Second – when you post to these forums, you are actually posting to
usenet newsgroups. Every message sent to usenet from our forums will
have your ExamNotes username -your email address will never be sent out.
A link to your profile on ExamNotes.net will also be included in the
signature. Please use good netiquette and be courteous just like when
you post to our regular forums.
At these time we offer only a few newsgroups, but we’ll add more to the
list soon when we find usenet newgroups that we think will be beneficial
to our members.
In conclusion – use these forums just like you are using our other
forums – read and reply to posts often!

I really hope you will find this feature a worthy addition to our community.
-- End of quoted post --

No mention of c.i.w.a.s.

- Iain.

[Andrew Thompson]

"Iain Hallam" ...
| Brian wrote:
| > 1. If anyone goes to the forum, you'll see why its participants post
| > the way they do. The interface is misleading, and there's no mention
| > of it being an access point to usenet.
|
| Announcement from administrator in forum 29 at the forum4designers site
| (which I just visited to see what people were talking about):
.....
| Web Based usenet access opens the doors to the wonderfull world of
| Usenet to new users that may not even know about usenet's existance.

So this *
http://groups.google.com/groups?grou...thoring.styles
heets
Kinda makes the site (forum for designers)
redundant, no?

* I am pretty sure it was mentioned earlier,
I just though I'd include it again in case there
are any poor sods _still_ shackled to that forum.

--
Andrew Thompson
* http://www.PhySci.org/ PhySci software suite
* http://www.1point1C.org/ 1.1C - Superluminal!
* http://www.AThompson.info/andrew/ personal site

[Brian]

Iain Hallam wrote:

Brian wrote:

If anyone goes to the forum, you'll see why its participants
post the way they do. The interface is misleading, and there's no
mention of it being an access point to usenet.
Announcement from administrator in forum 29 at the forum4designers
site

A new message, even though they have been acting as an interface for
at least a month. Perhaps longer. My point above is only contradicted
after the fact.
The usenet
"The usenet?" This has me worried that they don't have a real firm
grasp of what they are providing to their users.
Second – when you post to these forums, you are actually posting to
usenet newsgroups.
Please use good netiquette and be courteous just like when you post
to our regular forums.

....such as? No explanation of quoting style. No mention of threading.
And the interface misleads users who don't know about them.

--
Brian (follow directions in my address to email me)
http://www.tsmchughs.com/

Seen on the web:
This page best viewed by coming over to my office and looking at it on
my monitor.