Different results for div align

	Home Register Search Help Login

Sponsors

Shopping Cart Software
Ecommerce software integrated into Frontpage, Dreamweaver and Golive templates. No monthly fees and available in ASP and PHP versions.

Website Templates
We also have a wide selection of Dreamweaver, Expression Web and Frontpage templates as well as webmaster tools and CSS layouts.

Frontpage website templates
Creative Website Templates for FrontPage, Dreamweaver, Flash, SwishMax

Search Forums

Recent Posts

Todays Posts
Most Active posts
Posts since last visit
My Recent Posts
Mark posts read

Different results for div align

View related threads: (in this forum | in all forums)

Logged in as: Guest

Users viewing this topic: none

Printable Version

All Forums >> Web Development >> Cascading Style Sheets >> Different results for div align

Page: [1]


Starhugger Posts: 521 Joined: 4/12/2005 Status: offline	Different results for div align - 4/15/2006 2:33:46 Can someone help me understand why I'm getting different results with this, please? When I put <div align="center"> right in the body, the div centers. When I put the following in an external CSS file, it won't center: #shell { align: center; } Then in the body I put <div id="shell">, but it doesn't work. I haven't used it more than once in a file either. I've also tried saying "text-align: center" in the external CSS, but nope. I think I've also tried defining it as a class (e.g., ".shell" and then saying <div class="shell"> ) but that doesn't make it work either. It's just puzzling to me because it seems like it should do the same thing. Yet, it only seems to work if I put the centering attribute directly in-line in the div command. Anyone know why it works this way? Am I stating it wrong in the external CSS? Starhugger


Tailslide Posts: 6121 Joined: 5/10/2005 From: Out here on the raggedy edge Status: offline	RE: Different results for div align - 4/15/2006 3:57:26 align="center" is deprecated so that might be what's causing the problems when you try to put it in a stylesheet. Try #shell {text-align:center;} which will work for inline stuff such as text or images. _____________________________ "My strategy is so simple an idiot could have devised it" Little Blue Plane Web Design \| Blood, Sweat & Rust - A Land Rover restoration project (in reply to Starhugger)


jaybee Posts: 14175 Joined: 10/7/2003 From: Berkshire, UK Status: offline	RE: Different results for div align - 4/15/2006 7:07:32 You could also try #shell {margin: auto;} it depends where the div is in relation to other stuff on the page as to what will work. _____________________________ If it ain't broke..... fix it until it is. GAWDS Now where did I put that Doctype? (in reply to Tailslide)

Starhugger

Posts: 521
Joined: 4/12/2005
Status: offline

RE: Different results for div align - 4/15/2006 9:56:18

Thanks for replying, Tailslide and jaybee. Okay, this seems to be an IE thang.

It seems to work in FF but not in IE. (So what else is new...)

Here's what I've got in the external CSS. I've outlined it in red just to make sure everything in the div is centering, not just the text:

div.shell {
 width: 400px;
 height: 100px;
 border: solid red 2px;
 margin: auto;
 text-align: center;
 }

The HTML goes like this:

<body>
<div class="shell">
This is centered.
</div>
</body>

It doesn't seem to matter whether I define shell as a class or an ID. When I include "text-align: center" in the div definition, the text centers inside the box but with the box smushed over at the left in IE. If I put "text-align: center" only as an attribute of the body (which I've read sometimes is supposed to align stuff inside the body), both the text and box are left-aligned in IE.

My intention in doing this was to use it as a container for the whole page content. I've used a table for it in the past and I'm trying to break the habit. I'm starting to see why many people say the heck with it and just use tables! But I'm not giving up so easily.

Starhugger

(in reply to jaybee)


jaybee Posts: 14175 Joined: 10/7/2003 From: Berkshire, UK Status: offline	RE: Different results for div align - 4/15/2006 10:12:04 Is that all you have in the page? If so it should work. Have you used a doctype? Is there a link I can look at? OK, I've just tried it and it's working in all the browsers. Here's the full page code with internal styles. <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> <html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en" lang="en"> <head> <meta http-equiv="Content-Type" content="text/html; charset=windows-1252"> <title>New Page 1</title> <style type="text/css"> div.shell { width: 400px; height: 100px; border: solid red 2px; margin: auto; text-align: center; } </style> </head> <body> <div class="shell"> This is centered. </div> </body> </html> < Message edited by jaybee -- 4/15/2006 10:20:48 > _____________________________ If it ain't broke..... fix it until it is. GAWDS Now where did I put that Doctype? (in reply to Starhugger)


Starhugger Posts: 521 Joined: 4/12/2005 Status: offline	RE: Different results for div align - 4/15/2006 10:30:05 Duh... All it needed was the DocType. It's usually the last thing I add. Okay, I've learned my lesson... Thanks jaybee!! Starhugger (in reply to jaybee)


jaybee Posts: 14175 Joined: 10/7/2003 From: Berkshire, UK Status: offline	RE: Different results for div align - 4/15/2006 10:46:43 ooops. _____________________________ If it ain't broke..... fix it until it is. GAWDS Now where did I put that Doctype? (in reply to Starhugger)

Page: [1]

All Forums >> Web Development >> Cascading Style Sheets >> Different results for div align

Page: [1]

Jump to: 1

New Messages	No New Messages
Hot Topic w/ New Messages	Hot Topic w/o New Messages
Locked w/ New Messages	Locked w/o New Messages

Post New Thread

Reply to Message

Post New Poll

Submit Vote

Delete My Own Post

Delete My Own Thread

Rate Posts