AnuMohan Posted November 23, 2013 Share Posted November 23, 2013 Need an another help in using CSS with PHP FileI created a Php File to create Div's (three blue boxes) in the same row of the webpage. but when I zoom the webpage for 3 or 4 times, the boxes go one below another.My Php File is "index.php"<!doctype html><head><title>Test</title><link rel="stylesheet" href="stylesheet.css"/></head><body><div id=”Container” align="center"><div id="left"></div><div id="center"></div><div id="right"></div></div></body></html> My CSS File is "Stylesheet.css"#Container{margin: 0 auto;width: 1200px;}#left{background-color: blue;height:300px ;width: 100px;display:inline-block;}#center{background-color: blue;height:300px ;width: 100px;display: inline-block;}#right{background-color: blue;height:300px ;width: 100px;display: inline-block;}How to make website contents stay in the same row no matter how much we zoom the browser windowPlease help.Thanks in advance. Quote Link to comment Share on other sites More sharing options...
QuickOldCar Posted November 24, 2013 Share Posted November 24, 2013 How about this. <!doctype html> <head> <title>Test</title> </head> <body> <style> #Container{ margin: 0 auto; width: 100%; } #left{ color:white; background-color: blue; height:300px ; width: 100px; max-width:30%; display:inline-block; } #center{ color:white; background-color: blue; height:300px ; width: 100px; max-width:30%; display: inline-block; } #right{ color:white; background-color: blue; height:300px ; width: 100px; max-width:30%; display: inline-block; } </style> <div id=”Container” align="center"> <div id="left"> column 1 and some extra </div> <div id="center"> column 2 and some extra </div> <div id="right"> column 3 and some extra </div> </div> </body> </html> 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.