- This topic is empty.
March 7, 2012 at 3:00 pm #37031
the last few days I’ve been struggeling with an issue in IE… Alignment! I’m trying to align the div ‘container’ in the center of the browser. All browsers (Safari, Chrome, Firefox, Opera) handle the css (margin-left: auto; margin-right: auto;) fine but IE explorer doesn’t at all. It basically ignores that.
I’ve been checking around and found some work arounds that seem to work for other people but not for me. I’ve created a folder on my website to test this simple issues. http://www.test.kh-media.be/public
I’ve tried to create a wrapper with css (position: absolute; width: 100%;) for around the container. Didn’t work.
Text-align: center; for the container. Didn’t work.
CSS can be viewed in http://www.test.kh-media.be/css/main.css
Can somebody help me with this issues because it’s becoming a real PITA…
ThanksMarch 7, 2012 at 4:49 pm #98412
Can you show the HTML as well? I don’t see anything wrong in the CSS right away.March 7, 2012 at 5:10 pm #98414
How do I post clean code so it doesn’t renderMarch 8, 2012 at 5:26 pm #98525
Anyone? So I can paste my html? It keeps rendering…March 8, 2012 at 8:22 pm #98545
Paste HTML — select all HTML — click the
button at the top of the text area (white paper with blue thingies on it).March 8, 2012 at 10:51 pm #98553March 8, 2012 at 11:15 pm #98554TheDocMember
The doctype needs to come before the html tag.March 8, 2012 at 11:16 pm #98555TheDocMember
NOt having a doctype throws IE into Quirks Mode which basically means it goes crazy.March 9, 2012 at 1:56 am #98565karlpcrowleyParticipant
The start of your html pages should really look something like this
The rest of your code as normal....
It’s vital to have the meta charset before the title to prevent a certain type of xss hack
the rest of the code will make IE render the page as it shouldMarch 9, 2012 at 4:53 am #98576VermaasParticipant
This is what i use very often:
And with the css to align the container in the middle:
margin: 0px auto;
If your div, which you want to center, has no width, it’s almost impossible to align it in the middle of the screen. This is a good way to center your div. For the div’s (header, section, footer) inside the wrapper, just use float.
Hope this is helpfull to you.March 9, 2012 at 6:57 am #98580
Also not very good:
March 9, 2012 at 7:25 am #98582Paulie_DMember
is not a good idea.
Just give the wrapper/container a
border-top: 5px solid red;March 9, 2012 at 6:00 pm #98659
Thanks guys for reviewing my script. The problem is solved now but what about Senff’s comment… What’s wrong with using that div? Should I consider section? What are pro’s and con’s?
- The forum ‘CSS’ is closed to new topics and replies.