Fixed Header and Footer using CSS

If you want to create a header and footer part which will be fixed in their place then follow the below steps.

Place the below css in the page.
 <style type="text/css">
        #header
        {
            background: #eee;
            border: 1px solid #666;
            height: 60px;
            left: 0;
            position: fixed;
            width: 100%;
            top: 0;
            text-align: center;
        }
        #content
        {
            margin: 0 auto;
            overflow: auto;
            padding: 80px 0;
            width: 940px;
        }
        #footer
        {
            background: #eee;
            border: 1px solid #666;
            bottom: 0;
            height: 60px;
            left: 0;
            position: fixed;
            width: 100%;
            text-align: center;
        }
    </style>

Place the below content in the page.
<div id="header">
            Header Content
</div>
<div id="content">
           Text part will place here.
</div>
<div id="footer">
            Footer Content
</div>

Run the project by using F5 and see the output.

How to give rounded shape to Fieldset and Legend using CSS

In the head part:
<style>
        .fieldset1
        {
            border: 2px solid green;
            -moz-border-radius: 8px;
            -webkit-border-radius: 8px;
            border-radius: 8px;
            width: 300px;
        }
        .legend
        {
            background: White;
            border: solid 1px black;
            border-radius: 8px;
            -webkit-border-radius: 8px;
            -moz-border-radius: 8px;
            padding: 3px 1px;
        }
    </style>

In the body part:
<fieldset class="fieldset1">
        <legend class="legend">Shipping Information</legend>
        Hello...
 </fieldset>