Hi folks.
Please try not to laugh at my web design noobness, I'm a photoshop monkey, but I thought I'd have a go at updating this website to learn css & html, it's far more complex than I'd anticipated.
I've managed to cobble this much together, the css even validates:
http://www.accesscomms .com.au/Newsite2/
It displays nicely in Firefox but gives IE7 (and presumably IE6 & below) serious indigestion, it seems hellbent on positioning the first round cornered box on the line below the vertical menu, rather than next to it.
I think the problem must be in one of the following code excerpts somewhere, but I've no idea where :(
I've cut out all the bits I thought weren't relevant to this issue - I really am the n00biest of all n00bs, if I need to add more info for anyone to help, please let me know & I will.
The CSS
body {
background: #ffffff;
font-family: Arial, Helvetica, sans-serif;
color: #53565D;
font-size: 11pt;
}
#content {
width: 734px;
margin: 35px 0 auto;
}
/*Vertical Menu */
#VertMenu p {
margin:0 0px;
}
#VertMenu {
background: transparent;
float: left;
width: 150px;
padding: 0px 0px 0px 0px;
margin: 0px 0 auto;
}
/*Rounded Corner boxes*/
.roundcont {
margin: 0px 155px;
width: 579px;
background-color: #f0f0f0;
color: #53565d;
}
.roundcont p {
margin: 0 10px;
text-align: justify;
padding: 10px 0px 10px 10px;
font-size: 11pt;
}
.roundtop {
background: url(Borders/tr2.gif) no-repeat top right;
}
.roundbottom {
background: url(Borders/br1.gif) no-repeat top right;
}
img.corner {
width: 15px;
height: 15px;
border: none;
display: block !important;
}
Can anyone see the issue here?
Any help or advice on bashing this into shape in IE would be very very much appreciated.
Please try not to laugh at my web design noobness, I'm a photoshop monkey, but I thought I'd have a go at updating this website to learn css & html, it's far more complex than I'd anticipated.
I've managed to cobble this much together, the css even validates:
http://www.accesscomms .com.au/Newsite2/
It displays nicely in Firefox but gives IE7 (and presumably IE6 & below) serious indigestion, it seems hellbent on positioning the first round cornered box on the line below the vertical menu, rather than next to it.
I think the problem must be in one of the following code excerpts somewhere, but I've no idea where :(
I've cut out all the bits I thought weren't relevant to this issue - I really am the n00biest of all n00bs, if I need to add more info for anyone to help, please let me know & I will.
The CSS
body {
background: #ffffff;
font-family: Arial, Helvetica, sans-serif;
color: #53565D;
font-size: 11pt;
}
#content {
width: 734px;
margin: 35px 0 auto;
}
/*Vertical Menu */
#VertMenu p {
margin:0 0px;
}
#VertMenu {
background: transparent;
float: left;
width: 150px;
padding: 0px 0px 0px 0px;
margin: 0px 0 auto;
}
/*Rounded Corner boxes*/
.roundcont {
margin: 0px 155px;
width: 579px;
background-color: #f0f0f0;
color: #53565d;
}
.roundcont p {
margin: 0 10px;
text-align: justify;
padding: 10px 0px 10px 10px;
font-size: 11pt;
}
.roundtop {
background: url(Borders/tr2.gif) no-repeat top right;
}
.roundbottom {
background: url(Borders/br1.gif) no-repeat top right;
}
img.corner {
width: 15px;
height: 15px;
border: none;
display: block !important;
}
Can anyone see the issue here?
Any help or advice on bashing this into shape in IE would be very very much appreciated.
Comment