Solarpitch Posted August 31, 2011 Share Posted August 31, 2011 Hey Guys, Please look at the attached image. I have a div call left and right panel. When I hide the right panel using JS which I've created, I want to center the left panel in the wrapper like shown. I've tried a few different options using pargin auto and % scaling but not which much look. [attachment deleted by admin] Link to comment https://forums.phpfreaks.com/topic/246097-centering-a-div-inside-another/ Share on other sites More sharing options...
sunfighter Posted August 31, 2011 Share Posted August 31, 2011 without code its hard to do these things, but here's something to try. <!DOCTYPE HTML> <html> <head> <style type="text/css"> #container { border: red solid 1px; width: 500px; height: 175px; margin: auto; } #left { background-color: #330033; float:left; width: 300px; margin: auto; } #right { float:right; color: #FFFFFF; background-color: #000; width: 155px; height:100% } </style> </head> <body > <div id="container"> <div id="left"> <h2>welcome home</h2> <p>You big bad beautiful doll</p> <p>You big bad beautiful doll</p> <p>You big bad beautiful doll</p> </div> <div id="right">three little fishes</div> </div> </body> </html> If you comment out the "right" div in the body tag AND comment out float:left; in the #left css things are the way you want. Now see how to incorporate that. Link to comment https://forums.phpfreaks.com/topic/246097-centering-a-div-inside-another/#findComment-1264042 Share on other sites More sharing options...
cssfreakie Posted August 31, 2011 Share Posted August 31, 2011 Hey Guys, Please look at the attached image. I have a div call left and right panel. When I hide the right panel using JS which I've created, I want to center the left panel in the wrapper like shown. I've tried a few different options using pargin auto and % scaling but not which much look. It would indeed be useful if you would actually post code, instead of asking us to write the code for you. If you know how to set the css withjavascript all you have to do is to remove the float on the element and add margin:0 auto; ones you make the other dissapear. Link to comment https://forums.phpfreaks.com/topic/246097-centering-a-div-inside-another/#findComment-1264057 Share on other sites More sharing options...
Recommended Posts
Archived
This topic is now archived and is closed to further replies.