Problems with FORM from ASP.NET

[Tuppers360]

Hi there I have a site that I am building in ASP.NET when the page renders it places a form on the page and this is breaking my css to make the footer stick at the bottom of the page this is my code:

Code:

/* General */
html, body, form, #wrap
{
height: 100%;
}
body > #wrap
{
height: auto;
min-height: 100%;
}
/* Header */
#headerWrap
{
background-color: #444444;
}
#header
{
position: relative;
width: 80%;
height: 100px;
margin: 0 auto;
}
#header #logo
{
position: absolute;
top: 18px;
left: 10px;
height: 81px;
width: 67px;
}
#header #logo a
{
height: 81px;
width: 67px;
display: block;
text-decoration: none;
}
#header #title
{
margin: 0;
position: absolute;
font-size: 3.0em; /*To use if Image is created for header. background: url(../images/title.gif) no-repeat; text-indent: -999em;*/
}
#navbar
{
width: 80%;
margin: 0 auto;
}
#loginpanel
{
float:right;
}
/* Content Area Layout*/
#main
{
width: 80%;
margin: 0 auto;
clear: both;
padding-right: 10px;
padding-left: 10px;
padding-bottom: 150px;
}
#content
{
width: 70%;
float: left;
padding: 30px 0 25px 0;
}
#content #list
{
width: 200px;
float: left;
}
/* Sidebar */
#sidebar
{
width: 29%;
float: right;
padding: 30px 5px 25px 10px;
}
#sidebar ul
{
list-style: none;
}
#sidebar img
{
margin-right: 3px;
}
/* Footer */
#footer
{
position: relative;
margin-top: -150px; /* negative value of footer height */
height: 150px;
top: 0px;
left: 0px;
background-color: #444444;
}
#footer p
{
margin: 0 0 15px 0;
}
#foot
{
width: 80%;
margin: 0 auto;
height: 140px;
line-height: 1.0em;
padding: 0 10px 0 10px;
}
#foot #left
{
width: 400px;
float: left;
padding-top: 20px;
}
#foot #right
{
width: 250px;
float: right;
text-align: right;
padding-top: 20px;
}
}
/* CLEAR FIX*/
.clearfix:after
{
content: “.”;
display: block;
height: 0;
clear: both;
visibility: hidden;
}
.clearfix
{
display: inline-block;
}
/* Hides from IE-mac */
* html .clearfix
{
height: 1%;
}
.clearfix
{
display: block;
}
/* End hide from IE-mac */

My HTML code is the following:

Code:

 

Now if you run this it works, but if you add a form tag after the body tag (with an end one of course! the css breaks even though I have followed sites like sticky footer and ryan fait!) I cant get it to work now and I have no idea why! Can anyone please suggest anything?

Thanks in anticipation!

Tuppers

I have several other CSS files for styling I am not sure if you would like to see them aswell??? But I have tested with just my css layout style sheet and all is well without the form tag!!

[AshtonSanders]

That is strange. Do you have a link or screenshots so we can see what you mean by

Quote:

breaking my css to make the footer stick at the bottom of the page

[Tuppers360]

I have fixed it now! Not sure exactly what was causing it just started at the begining! and a few hours later its working!

Probably due to clean the code really!

Thanks for looking and if I do find out why it wasnt working I will post the reason!

Cheers

Tuppers

[Author]

Posts