Michdd Posted May 16, 2009 Share Posted May 16, 2009 Is there a way to place to 2 elements side-by-side while keeping them both centered? Not separately centered, obviously but collectively. Say there's 2 tables side by side (possibly using floats?) and centering them. Quote Link to comment https://forums.phpfreaks.com/topic/158404-centering-side-by-side-elements/ Share on other sites More sharing options...
Axeia Posted May 16, 2009 Share Posted May 16, 2009 Just put them in a container the width of both your elements and float that in the middle? Quote Link to comment https://forums.phpfreaks.com/topic/158404-centering-side-by-side-elements/#findComment-835517 Share on other sites More sharing options...
Masna Posted May 16, 2009 Share Posted May 16, 2009 Put them in a super container and apply the following to said container: margin-left: auto; margin-right: auto; Don't forget to use float: left on the elements you want to place side by side, and give them distinct widths (whether by percentage or invariable pixels). Quote Link to comment https://forums.phpfreaks.com/topic/158404-centering-side-by-side-elements/#findComment-835521 Share on other sites More sharing options...
TheFilmGod Posted May 16, 2009 Share Posted May 16, 2009 This might get complicated. Depending on if both boxes are fixed widths or not, a "super" parent container may or may not worked. You need a fixed width to center using margion: 0 auto; If you don't have a fixed width, you could utilize some awesome css2! Display: table; Doesn't work in IE7, but IE8 finally supports it. Quote Link to comment https://forums.phpfreaks.com/topic/158404-centering-side-by-side-elements/#findComment-835526 Share on other sites More sharing options...
dbrimlow Posted May 19, 2009 Share Posted May 19, 2009 You need a fixed width to center using margion: 0 auto; Actually, you just need a declared width that is smaller than its parent container - it could be pixel (fixed) or percentage (fluid). The whole point of "margin: 0 auto" is top and bottom are "0" and right and left are "auto". It is the "auto" that determines how far each side's margin should be based on the container's declared width in relation to its parent container's width. If no width is declared, then 100% is assumed. There are no margins of a box that is 100% the width of its parent (there is nothing to auto calculate to). Quote Link to comment https://forums.phpfreaks.com/topic/158404-centering-side-by-side-elements/#findComment-836902 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.