A Digital Age Deserves A Digital Leader

CSS alternative to 'center' tag

CSS alternative to 'center' tag

Postby gries818 » Wed Dec 24, 2008 8:47 pm

Since I started using CSS over the old school 'style' tags (ie 'font'), I 've never been able to find a very good replacement of the 'center' tag. I still use it, but I would prefer if an alternative could be found...

... you know, just to be pure. :lol:
Image

Mac OS 10.6.7 - Personal
Ubuntu Server 11.04 - Server
Software Development
User avatar
Posts: 3991
Joined: Wed Jul 07, 2004 6:28 pm

Re: CSS alternative to 'center' tag

Postby kanaloa » Wed Dec 24, 2008 10:47 pm

gries818 wrote:Since I started using CSS over the old school 'style' tags (ie 'font'), I 've never been able to find a very good replacement of the 'center' tag. I still use it, but I would prefer if an alternative could be found...

... you know, just to be pure. :lol:


[ below is equal to <

Code: Select all
[div style="margin:0 auto"]your content here[/div]


Of course a div tag by default is 100% wide, so if you want it centered, you'll also need to specify a "width:123px" for the div or p itself.

You can also use "text-align:center" to center text within a div or p tag. And worst case, just do
Code: Select all
[div align="center"]


This won't work on the span tag, since it's an inline tag. You'd have to make it a block tag for it to work on that.
"Greatness is not a function of circumstance. Greatness, it turns out, is largely a matter of conscious choice, and discipline." - Jim Collins
President
User avatar
Posts: 11795
Joined: Sun Mar 10, 2002 1:18 am
Location: Columbia, SC
Real Name: John Derrick

Re: CSS alternative to 'center' tag

Postby gries818 » Thu Jun 11, 2009 1:19 am

kanaloa wrote:
gries818 wrote:Since I started using CSS over the old school 'style' tags (ie 'font'), I 've never been able to find a very good replacement of the 'center' tag. I still use it, but I would prefer if an alternative could be found...

... you know, just to be pure. :lol:


[ below is equal to <

Code: Select all
[div style="margin:0 auto"]your content here[/div]


Of course a div tag by default is 100% wide, so if you want it centered, you'll also need to specify a "width:123px" for the div or p itself.

You can also use "text-align:center" to center text within a div or p tag. And worst case, just do
Code: Select all
[div align="center"]


This won't work on the span tag, since it's an inline tag. You'd have to make it a block tag for it to work on that.


This trick doesn't seem to work in Safari. Any idea why?

And the center tag doesn't center within a div like Firefox does. WTF Apple :unsure:
Image

Mac OS 10.6.7 - Personal
Ubuntu Server 11.04 - Server
Software Development
User avatar
Posts: 3991
Joined: Wed Jul 07, 2004 6:28 pm

Re: CSS alternative to 'center' tag

Postby kanaloa » Thu Jun 11, 2009 2:55 am

That's why I only worry about FF and IE (and I wish I didn't have to bother with the later, though at least they are making progress - I just wish they'd 'force' upgrades like FF does).
"Greatness is not a function of circumstance. Greatness, it turns out, is largely a matter of conscious choice, and discipline." - Jim Collins
President
User avatar
Posts: 11795
Joined: Sun Mar 10, 2002 1:18 am
Location: Columbia, SC
Real Name: John Derrick

Re: CSS alternative to 'center' tag

Postby gries818 » Thu Jun 11, 2009 4:18 am

kanaloa wrote:That's why I only worry about FF and IE (and I wish I didn't have to bother with the later, though at least they are making progress - I just wish they'd 'force' upgrades like FF does).


Hmm, well since I use Safari as my main browser, I'd kind of like to write sites that work just as well with it as in Firefox.

The problem appears to be that Safari treats the center tag as the center of the page, and not the center of an element like Firefox and IE. I'm sure there is a way around this... I never have problems out on the web with Safari.

I'll post when I figure it out ^*^
Image

Mac OS 10.6.7 - Personal
Ubuntu Server 11.04 - Server
Software Development
User avatar
Posts: 3991
Joined: Wed Jul 07, 2004 6:28 pm

Re: CSS alternative to 'center' tag

Postby gries818 » Thu Jun 11, 2009 9:42 pm

Crazily, text-align:center seems to accomplish the task on both browsers.
Image

Mac OS 10.6.7 - Personal
Ubuntu Server 11.04 - Server
Software Development
User avatar
Posts: 3991
Joined: Wed Jul 07, 2004 6:28 pm

Re: CSS alternative to 'center' tag

Postby kanaloa » Thu Jun 11, 2009 11:24 pm

gries818 wrote:Crazily, text-align:center seems to accomplish the task on both browsers.


:lol: Hopefully the next version of CSS will get a lot of these "interesting" issues fixed.
"Greatness is not a function of circumstance. Greatness, it turns out, is largely a matter of conscious choice, and discipline." - Jim Collins
President
User avatar
Posts: 11795
Joined: Sun Mar 10, 2002 1:18 am
Location: Columbia, SC
Real Name: John Derrick

Re: CSS alternative to 'center' tag

Postby gries818 » Fri Jun 12, 2009 2:53 pm

kanaloa wrote:
gries818 wrote:Crazily, text-align:center seems to accomplish the task on both browsers.


:lol: Hopefully the next version of CSS will get a lot of these "interesting" issues fixed.


The really interesting part is that the text-align:center works on one of my divs, but not another :-?

But at least it isn't working in both Safari and Firefox... hopefully it is for the same reason.
Image

Mac OS 10.6.7 - Personal
Ubuntu Server 11.04 - Server
Software Development
User avatar
Posts: 3991
Joined: Wed Jul 07, 2004 6:28 pm

Return to HTML, CSS, and Scripts

Who is online

Users browsing this forum: No registered users and 1 guest

cron
cron