Please take a look at this page: http://www.c3558737.myzen.co.uk/index.php?option=com_rsform&Itemid=5
It looks fine in all browsers except IE7 and (I assume) below. IE7 seems to be inserting a carriage return before the ‘Contact’ heading making the alignment off compared to the other pages.
I guess it has something to do with the <form> tag. As this page is generated dynamically, using Joomla, I can’t simply move the <form> tag further down the page.
Is there some other work around?
/* ************************************************************************************************** */
/* CSS by Owen Sutton */
/* owensutton.com */
/* */
/* */
/* ************************************************************************************************** */
/* CONTENT CSS */
/* ************************************************************************************************** */
body {
font-family: Arial, Helvetica, sans-serif;
font-size:12px;
background-color:#4f4f4f;
}
h3 {
font-size:1.1em;
}
#wrapper{
width:860px;
margin:auto;
}
#header-top{
height:83px;
background-image:url(../images/wordspeare-logo.png);
background-repeat:no-repeat;
padding:0px;
}
#header{
background-image:url(../images/shadow-width.png);
background-repeat: repeat-y;
padding-right:2px;
padding-bottom:15px;
}
/* xxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxx Menu xxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxx */
#menu {
background-image:url(../images/menu-bar-full.png);
background-repeat:no-repeat;
height:42px;
font-weight:normal;
padding-right:70px;
text-align:right;
}
#menu ul {
padding:11px 0px 12px 0px;
margin:auto;
list-style:none;
}
#menu li {
display:inline;
}
#menu #current a {
background-image:url(../images/menu-bar-light-blue.png);
background-repeat:repeat-x;
}
#menu #current a:hover {
background-image:url(../images/menu-bar-grey.png);
background-repeat:repeat-x;
}
#menu a {
/*border:solid 1px #000000;*/
text-decoration:none;
color:#FFFFFF;
font-size:18px;
padding:11px 16px 10px 16px;
}
#menu a:hover {
background-image:url(../images/menu-bar-grey.png);
background-repeat:repeat-x;
}
/* xxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxx CONTENT xxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxx */
#content {
/*border:solid 1px #000000;*/
background-image:url(../images/shadow-width.png);
background-repeat:repeat-y;
}
#clearall {
clear:both;
}
/* xxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxx LEFT xxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxx */
#left {
float:left;
width:195px;
margin-left:70px;
margin-right:15px;
padding-top:45px;
color:#a6a5a5;
font-size:15px;
font-style:italic;
}
#left .moduletable{
padding:20px 5px 0px 5px;
}
#left h3{
color:#fc9e00;
font-size:22px;
font-weight:normal;
font-style:normal;
}
#left p{
line-height:18px;
margin:0;
padding:0;
margin-bottom:5px;
}
#left .article_separator {
margin-top:10px;
border-top:1px dashed #a6a5a5;
display:block;
width:100%;
}
#left .moduletable_download a{
display:block;
height:55px;
color:#ffffff;
font-size:12px;
background-image:url(../images/download-button.png);
background-repeat:no-repeat;
background-position:0px -55px;
text-decoration:none;
}
#left .moduletable_download a:hover{
background-position:0px 0px;
}
#left .moduletable_purchase {
padding-top:8px;
}
#left .moduletable_purchase a{
display:block;
height:55px;
color:#ffffff;
font-size:12px;
background-image:url(../images/purchase-button-green.png);
background-repeat:no-repeat;
background-position:0px -55px;
text-decoration:none;
}
#left .moduletable_purchase a:hover{
background-position:0px 0px;
}
/* xxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxx Centre xxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxx */
#mainbody {
font-size:15px;
margin:0;
padding:0;
color:#ffffff;
line-height:20px;
padding-top:45px;
margin-left:290px;
margin-right:70px;
/*border:1px solid #ffffff;*/
}
.contentheading { /* xxxxxxxx Article Title xxxxxxxxxxxxxxxx */
color:#fc9e00;
font-size:28px;
font-weight:normal;
padding-left:0px;
font-family: Verdana, Arial, Helvetica, sans-serif;
padding-bottom:20px;
line-height:24px;
}
#mainbody .contentpaneopen {
width:100%;
}
#mainbody p{
margin:0;
margin-bottom:20px;
padding:0;
}
h1 {
font-weight: normal;
font-size:18px;
color:#ffffff;
padding:0px;
padding-bottom:5px;
margin:0px;
/*background-color: #EAEAEA;*/
}
h2 {
font-weight: bold;
font-size:16px;
color:#393491;
/*background-color: #EAEAEA;*/
padding:4px 4px 4px 0px ;
}
.small {
font-size:11px;
color:#999999;
line-height:12px;
}
.createdate {
line-height:12px;
font-size:11px;
color:#999999;
padding-bottom:10px;
}
#mainbody img.border{
padding:5px;
margin:5px 15px 5px 5px ;
border:1px solid #999999;
}
#mainbody img.noborder{
border:none;
padding:0px;
margin:0px;
}
#mainbody a{
color:#fff;
}
#mainbody a:link {
}
#mainbody a:visited {
}
#mainbody a:hover {
color:#CCCCCC;
}
#mainbody a:active {
}
/* xxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxx Footer Menu xxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxx */
#footer{
text-align:center;
background-image:url(../images/shadow-bottom.png);
background-repeat: no-repeat;
margin:0px;
height:38px;
}
#footer ul {
padding:0px;
padding-top:11px;
margin:auto;
height:42px;
/*border:solid 1px;*/
width:926px;
list-style:none;
}
#footer li {
display:inline;
}
#footer li:hover {
}
#footer a {
text-decoration:none;
color:#666666;
border-right:1px solid #666666;
padding:0px 10px 0px 10px;
}
#footer a:link {
}
#footer a:visited {
}
#footer a:hover {
color: #333333;
}
#footer a:active {
}
/* xxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxx Credits xxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxx */
#credits{
margin:0px;
padding-right:55px;
height:50px;
padding-top:0px;
color:#999999;
font-size:10px;
text-align:right;
}
#credits a{
color:#999999;
text-decoration:none;
}
#credits a:hover{
color:#999999;
text-decoration: underline;
}
a:link {
}
a:visited {
}
a:hover {
}
a:active {
}
a:link img {
border:none;
padding:0px;
margin:0px;
}