robert_gsfame Posted December 25, 2009 Share Posted December 25, 2009 i try to auto margin the <div> to make it centered but i have problem. let say i have this #apDiv5 { position:absolute; left:195px; top:209px; width:397px; height:25px; z-index:5; } n i want to make it auto margin but with the same left and top position....can anyone help me? thx in advance Quote Link to comment Share on other sites More sharing options...
haku Posted December 25, 2009 Share Posted December 25, 2009 Auto margins don't work when you have absolute positioning. They can't - the whole point of absolutely positioning an element is to make it absolutely be in that position no matter what. Also, having an auto margin but keeping it in the same position as far as the left doesn't make sense. You either want it to center, or you want it to be where it is. It can't do both. Let me give you some work that will save you a lot of work: Remove all the absolute positioning from your CSS, and spend a few hours learning how to position elements with floats. Absolute positioning is fools gold - looks nice but is mostly worthless. Quote Link to comment Share on other sites More sharing options...
robert_gsfame Posted December 25, 2009 Author Share Posted December 25, 2009 okay..so i have to use auto margin n put everything inside the table <table></table>, is that what you mean haku? Quote Link to comment Share on other sites More sharing options...
vinpkl Posted December 25, 2009 Share Posted December 25, 2009 see this example for reference http://help.veign.com/css-center-webpage.php in the above example you can keep body margin to 0px instead of 20px; Quote Link to comment Share on other sites More sharing options...
haku Posted December 25, 2009 Share Posted December 25, 2009 okay..so i have to use auto margin n put everything inside the table <table></table>, is that what you mean haku? No, that's not what I meant at all. And actually, tables are even worse. What I meant is what I said - spend a few hours/days learning to position using floats. Quote Link to comment Share on other sites More sharing options...
SuperBlue Posted December 27, 2009 Share Posted December 27, 2009 I wouldn't take haku's advice on absolute positioning to seriously, its ungrounded. You just need to remember this basic rule of thumb, absolute positioning only works inside other elements, when their position is set to something else then static. Centering elements using absolute positioning, can be done using percentages. Example follows. <!DOCTYPE html> <html lang="en-US"> <head> <title>My first Website</title> <style type="text/css"> #Basement { position: relative; margin: auto; width: 75%; /* The layout takes up this Percentage width, but can't be wider then max-width, and narrower then min-width. */ min-width: 768px; max-width: 1600px; } #Main { position: absolute; left: 25%; width: 50%; background: #808080; min-height: 400px; } </style> </head> <body> <div id="Basement"> <div id="Main"> <p>My first Website.</p> </div> </div> </body> </html> In this case i set Basement to relative, to enable absolute positioning relatively to its specified boundaries, i then used left: 25%; Which is about half the width of Main, obviously this will center the element nicely. Quote Link to comment Share on other sites More sharing options...
haku Posted December 28, 2009 Share Posted December 28, 2009 Oh it was grounded. We've had this argument before, and the only example you could show me was some crappy site design you did that had no elements overtop each other vertically. Layouts that are positioned with Aboslute positioning don't work. Simple as that. Until you can show me one decent site anywhere that has been positioned absolutely, I can only say that you don't know what you are talking about. Quote Link to comment Share on other sites More sharing options...
SuperBlue Posted December 30, 2009 Share Posted December 30, 2009 Oh it was grounded. We've had this argument before, and the only example you could show me was some crappy site design you did that had no elements overtop each other vertically. Layouts that are positioned with Aboslute positioning don't work. Simple as that. Until you can show me one decent site anywhere that has been positioned absolutely, I can only say that you don't know what you are talking about. You mean in this in This Thread ? That's over a year ago, and you did actually view some of my layouts, the link posted by bronzemonkey, was in fact a collection of older Example layouts on my company Website, designed by me. I thought we basically agreed back then, at least thats whats it looks like when i read some of your later posts in the thread, though it appears i was busy showing bronzemonkey that the coding required was about the same, which holds true for more complex layouts as well. The only problem with AP, (as far as i know), is that you can't have a footer, which spans across all of the columns, and gets "pushed" accordingly by the longest column. But hay, far from all layouts includes a footer, and you can still include a footer in the center column, which is a fairly common design. I would likely still use AP to some degree for footer layouts, while floating the contents of the main wrapper. I.e. Use AP for the Header and Footer, the rest can be accomplished with relative positioning and floats. Quote Link to comment Share on other sites More sharing options...
haku Posted January 3, 2010 Share Posted January 3, 2010 I didn't see any layout that was any decent in there. Quote Link to comment Share on other sites More sharing options...
SuperBlue Posted January 5, 2010 Share Posted January 5, 2010 Then look again. Quote Link to comment Share on other sites More sharing options...
haku Posted January 5, 2010 Share Posted January 5, 2010 I did. Quote Link to comment Share on other sites More sharing options...
Recommended Posts
Join the conversation
You can post now and register later. If you have an account, sign in now to post with your account.