November 1, 201312 yr hello guys, I am creating my first website, and i did all the borders, using divs. i looks like this . how do i align at the centre?
November 1, 201312 yr Put your entire layout inside a <div></div> (that's within the body tags, of course) with the following CSS: div{ margin: auto; } This'll align it down the middle.
November 1, 201312 yr Author can you post up the html code sure html code <Doctype HTML> <html> <head> <link type="text/css" rel="stylesheet" href="first-project.css"/> <title> E.luxman</title> <body> <script type="text/javascript"> Document.write("hey now brown cow"); </script> <div align="center"></div> <div id="logo"></div> <div id="menue"></div> <div id="main"></div> <div id="footer"></div> </body> </html> css body{ height:850px; width:1000px; background-image:url(images/provaimg_10.png) } #logo{ margin-left:50px; margin-right:50px; margin-top:25px; border:2px solid; width:700px; height:100px; border-radius:10px; position:absolute; align-self:center; } #menue{ margin-left:50px; margin-right:50px; margin-top:145px; border:2px solid; height:285px; width:148px; border-radius:10px; position:absolute; } #main{ margin-left:220px; margin-right:50px; margin-top:145px; border:2px solid; height:551px; width:530px; position:absolute; border-radius:10px; } #footer{ margin-left:50px; margin-right:50px; margin-top:745px; margin-bottom:50px; border:2px solid; position:absolute; border-radius:10px; height:69px; width:699px; display:center; }
November 1, 201312 yr have a look at what i done here and implement it into your code http://jsfiddle.net/QxcbD/
November 1, 201312 yr Author have a look at what i done here and implement it into your code http://jsfiddle.net/QxcbD/ Oh thanks a lot, could you please explain why you used the container div? and why did you set to class and not ID?
November 1, 201312 yr I would use a container as it explains itself realy it contains all the divs you are using so if you want to position them all easily you just position the container. As for IDs you can only use them once in a page where as a class you can use multiple times, you can also stack classes like so .container { margin:auto !important; } .full-width { width: 100%; } .half-width { width: 50%; } .blue { color:blue; } <div class="container full-width blue">blue full width</div> <div class="container full-width">full width</div> <div class="container half-width">half width</div> <div class="container half-width blue">blue half width</div>
Create an account or sign in to comment