By using this site, you agree to our updated Privacy Policy and our Terms of Use. Manage your Cookies Settings.
424,846 Members | 1,646 Online
Bytes IT Community
+ Ask a Question
Need help? Post your question and get tips & solutions from a community of 424,846 IT Pros & Developers. It's quick & easy.

text-align:center not working in Mozilla

P: n/a
Hello;

I'm fairly new to CSS, but have learned that Mozilla is supposed to be the
most compliant in rendering.

I have a web page that uses a style sheet with a class named "page_links"
that centers the various links at the top of the page, just under a heading
as in:

---------------- HEADING ---------------
home hardware software forum about

The code in the html page is:

<span class="page_links">home hardware software forum about</span>

----- a snippet from the style sheet ------------------------------
..page_links {
text-align: center;
background-color : red; /*cyan; #FFFFCC;*/
border-style : solid;
border-color : cyan;
border-width : 1px;
/* color : white; */
font-size: xx-small;
font-family : Comic Sans MS;
margin-bottom : 20px;
width : 100%;
}
-------------------------------------------------------------------

This works fine in IE (of course) and in Opera (v7.50), but in Mozilla, the
links are LEFT justified. Well, I got to doing some research on google.
Could not find anything specific, but did find the following:

<p style="text-align: center">.. centered text ..</p>

which I promptly inserted into said html page... and abbra-cadabbra -- this
centers the above text.

Is there something I need to know about using the <SPAN> tag in Mozilla?

Any assistance will be appreciated.

Charles...
---
Outgoing mail is certified Virus Free.
Checked by AVG anti-virus system (http://www.grisoft.com).
Version: 6.0.788 / Virus Database: 533 - Release Date: 11/1/04
Jul 21 '05 #1
Share this Question
Share on Google+
3 Replies


P: n/a
On Fri, 05 Nov 2004 05:53:25 GMT, Charles Crume
<cc@charlescrumesoftware.com> wrote:
Hello;

I'm fairly new to CSS, but have learned that Mozilla is supposed to be
the
most compliant in rendering.
Depends. Opera is sometimes more compliant.
I have a web page that uses a style sheet with a class named "page_links"
that centers the various links at the top of the page, just under a
heading
as in:

---------------- HEADING ---------------
home hardware software forum about


This is a list of links, yes?

See http://www.alistapart.com/articles/taminglists/ and call me in the
morning.
Jul 21 '05 #2

P: n/a
> Hello;

I'm fairly new to CSS, but have learned that Mozilla is supposed to be the
most compliant in rendering.

I have a web page that uses a style sheet with a class named "page_links"
that centers the various links at the top of the page, just under a heading as in:

---------------- HEADING ---------------
home hardware software forum about

The code in the html page is:

<span class="page_links">home hardware software forum about</span>

----- a snippet from the style sheet ------------------------------
.page_links {
text-align: center;
background-color : red; /*cyan; #FFFFCC;*/
border-style : solid;
border-color : cyan;
border-width : 1px;
/* color : white; */
font-size: xx-small;
font-family : Comic Sans MS;
margin-bottom : 20px;
width : 100%;
}

Is there something I need to know about using the <SPAN> tag in Mozilla?

Any assistance will be appreciated.

Charles...


<span /> is an inline element, so it does not have width property - is as
wide as its content (untill the width is limited by parent's width), so
Mozillas behavior is absolutely correct.
You can:
a. use { display: block; } property for this span (the width: 100%; should
work then),
b. use <div /> instead of using <span />
c. use 100% wide <div /> with { text-align: center }and put this span inside
it.
d. use { display: block; margin: 0 auto 20px auto; } /*20px is your actual
bottom margin*/

But as Neal suggested, there is list element to make lists and it would be
the better way.

Jul 21 '05 #3

P: n/a

"vatore" <va****@wp.pl> wrote in message
news:cm**********@achot.icm.edu.pl...

[snip]
Is there something I need to know about using the <SPAN> tag in Mozilla?
<span /> is an inline element, so it does not have width property - is as
wide as its content (untill the width is limited by parent's width), so
Mozillas behavior is absolutely correct.


Thanks for the info!

You can:
a. use { display: block; } property for this span (the width: 100%; should
work then),
b. use <div /> instead of using <span />
c. use 100% wide <div /> with { text-align: center }and put this span inside it.
d. use { display: block; margin: 0 auto 20px auto; } /*20px is your actual
bottom margin*/
I choose to use "b" -- works OK now.

But as Neal suggested, there is list element to make lists and it would be
the better way.


Why is it better?? (I do not want a "list", but just a horizontal row of
links.)

Thanks again for the help.

Charles...
---
Outgoing mail is certified Virus Free.
Checked by AVG anti-virus system (http://www.grisoft.com).
Version: 6.0.789 / Virus Database: 534 - Release Date: 11/7/04
Jul 21 '05 #4

This discussion thread is closed

Replies have been disabled for this discussion.