Live Chat & Podcast at 1:00PM Eastern on Sunday!
There's no such thing as a stupid question, but they're the easiest to answer.
JoinTour
Login
Search
Web Design & Development
Tag Cloud
access acer asus bios bsod computer crash desktop dns driver drivers error ethernet excel freeze gaming hard drive hardware hdmi internet laptop malware memory monitor motherboard network not working printer problem ram registry repair router slow software sound trojan ubuntu 11.10 uninstall usb video virus vista wifi windows windows 7 windows 7 32 bit windows 7 64 bit windows xp wireless
Search
Search for:
Tech Support Guy Forums > Internet & Networking > Web Design & Development >
Solved: main container block div wont center

Reply  
Thread Tools
ggordie's Avatar
Member with 143 posts.
 
Join Date: Jul 2005
Location: palm harbor
Experience: Intermediate
26-May-2007, 06:17 PM #1
Angry Solved: main container block div wont center
i've tried everything and cant figure it out. setting the margins wont work, text-align wont work, or maybe i'm just doing it wrong.. plese help before my brain explodes. here's what i got.

Code:
<html>
<head>
<title>
ggordie
</title>
<style>


div#main {
margin-right: 10%;
margin-left: 10%;
width: auto;
padding:3px;
height:100%;
position:absolute;
top:0px;
border-width: 2px;
border-style: solid;
border-color: #ffffff #000000;
}

</style>
</head>
<body>

<div id="main">
test
</div>

</body>
</html>
namenotfound's Avatar
Computer Specs
Senior Member with 3,003 posts.
 
Join Date: Apr 2005
Location: New York
Experience: no man can be my equal
26-May-2007, 06:20 PM #2
Instead of setting the width to auto, set the margins to auto.

Try something like this:

margin-right: auto;
margin-left: auto;
width: 80%;
ggordie's Avatar
Member with 143 posts.
 
Join Date: Jul 2005
Location: palm harbor
Experience: Intermediate
27-May-2007, 01:24 AM #3
tried it.

it works on the older browsers, but in the latest versions of ie & ff it will set the width for the div but ignores the margin attributes thus creating a left aligned hunk of worthless div.

thanks tho.

anyone know how to get around this?
jaymanson's Avatar
Computer Specs
Senior Member with 213 posts.
 
Join Date: Mar 2007
Location: Christchurch, New Zealand
Experience: Advanced Design/HTML/CSS - Intermediate PHP
27-May-2007, 04:25 AM #4
namenotfound is completely right, but the reason it's still ignoring your positioning using the margins is because you are also defining the position as absolute, which will override the auto margins.

Take namenotfound's advice, and also remove the positioning elements and it'll work just fine

Code:
div#main {
margin-right: auto;
margin-left: auto;
width: 80%;
padding:3px;
height:100%;
border: 2px;
border-style: solid;
border-color: #ffffff #000000;
}
dudeking's Avatar
Member with 483 posts.
 
Join Date: Feb 2007
Location: UK, Midlands
Experience: Advanced
27-May-2007, 06:45 AM #5
I always have this problem, I'm boring and still use <center> </center>

It works fine so why change lol
ggordie's Avatar
Member with 143 posts.
 
Join Date: Jul 2005
Location: palm harbor
Experience: Intermediate
27-May-2007, 05:57 PM #6
yeah, i ended up just using a table, appearently, from all i've found on google you have to set an actual height in ie thats not a percentage otherwize it will always default to auto, even if you set the height of the containing tag to 100%. thanks for the help though!
__________________
myspace.com/ggordie
dudeking's Avatar
Member with 483 posts.
 
Join Date: Feb 2007
Location: UK, Midlands
Experience: Advanced
27-May-2007, 07:09 PM #7
Where would we be with out tables.....I can't handle all this css/div nonsense lol
Reply

THIS THREAD HAS EXPIRED.
Are you having the same problem? We have volunteers ready to answer your question, but first you'll have to join for free. Need help getting started? Check out our Welcome Guide.

Search Tech Support Guy

Find the solution to your
computer problem!




Currently Active Users Viewing This Thread: 1 (0 members and 1 guests)
 
WELCOME TO TECH SUPPORT GUY! Are you looking for the solution to your computer problem? Join our site today to ask your question -- for free! Our site is run completely by volunteers who want to help you solve your computer problems. See our Welcome Guide to get started.
Thread Tools



Facebook Facebook Twitter Twitter TechGuy.tv TechGuy.tv Mobile TSG Mobile
You Are Using:
Server ID
Advertisements do not imply our endorsement of that product or service.
All times are GMT -4. The time now is 01:55 AM.
Copyright © 1996 - 2011 TechGuy, Inc. All rights reserved.

Powered by Cermak Technologies, Inc.