Mind blowing SEO improving and Google rank increasing Signature Rotator SEO Tool.

Thread: 

How do you make a wrapper in css/html?

Ads
ivan Offline referral

Posts: 713
Joined: Jul 2013
Reputation: 6

#1
Senior Member
What is wrapper in css and how do you make it?
chod Offline referral

Posts: 860
Joined: Jul 2013
Reputation: 85

#2
Posting Freak
CSS
Code:
#wrapper {
    width: 500px;
    margin: 0 auto;
}

HTML
Code:
<body>
    <div id="wrapper">
       Centered div with 500px width text on page
    </div>
</body>

Adjust margin to your needs
Code:
margin-left: auto; margin-right: auto;
Are other options auto being the easiest to make sure it's centered.
www.AdminEmpire.com
www.BlimptonTech.com - Best Free Online JavaScript tool to minify JavaScript files.
maya Offline referral

Posts: 1,058
Joined: May 2013
Reputation: 34

#3
Posting Freak
Good post chod. Wrapper that is what keeps everything inside it together!
ivan Offline referral

Posts: 713
Joined: Jul 2013
Reputation: 6

#4
Senior Member
Thanks chod I appreciate that
invisibe_dude Offline referral

Posts: 820
Joined: May 2013
Reputation: 24

#5
Posting Freak
Here is how you should properly design your website in order to keep everything where it belongs!

HTML code

PHP Code:
<body>
    <
div class="wrapper">
    <
div class="header"></div>
    <
div class="content"></div>
    <
div class="footer"></div>
    </
div>
    </
body

CSS code

Code:
html,
    body {
    margin:0;
    padding:0;
    height:100%;
    }
    .wrapper {
    min-height:100%;
    position:relative;
    }
    .header {
    padding:10px;
    background:#5ee;
    }
    .content {
    padding:10px;
    padding-bottom:80px;
    }
    .footer {
    width:100%;
    height:80px;
    position:absolute;
    bottom:0;
    left:0;
    background:#ee5;
    }

This code is great because it helps to keep footer at bottom of screen!





User(s) browsing this thread: 1 Guest(s)