jtn3833
Thread Starter
- Joined
- Dec 29, 2000
- Messages
- 453
This webpage displays fine in FF & chrome, but in IE each word of text is on the next line, and the div box doesn't extend down below it. I'm new to forms, is there extra code needed for IE or something else I'm missing?
http://www.thenserenity.com/form.html
i have 2 css files, 1 basic (for all browsers) and 1 for IE:
--------------------------------------------------------
basic css:
@charset "utf-8";
/* CSS Document */
body {
background-image: url(../images/background_gradiant.jpg);
background-repeat:repeat-x;
background-color:#ccccfe;
font-family:Arial, Helvetica, sans-serif;
margin:0;
padding:0;
border:0;
}
#header {
width:800px;
height:191px;
margin-top: 25px;
margin-left:auto;
margin-right:auto;
background-image:url(../images/logo-top.png);
}
/*Testimonials*/
#header-bottom1 {
width:800px;
height:83px;
margin-left:auto;
margin-right:auto;
background-image:url(../images/logo-bottom1.png);
}
#header-bottom2 {
width:800px;
height:83px;
margin-left:auto;
margin-right:auto;
background-image:url(../images/logo-bottom2.png);
}
#header-bottom3 {
width:800px;
height:83px;
margin-left:auto;
margin-right:auto;
background-image:url(../images/logo-bottom3.png);
}
/*Testimonials*/
#nav-wrap {
width:820px;
height:100%;
margin-left:auto;
margin-right:auto;
}
.nav {
width: 163px;
height: 120px;
position: absolute;
z-index: 50;
clear: both;
margin-top:74px;
}
#wrapper {
width:800px;
height:100%;
margin-left:auto;
margin-right:auto;
margin-top:25px;
}
.photoleft {float: left; padding:0px 10px 0px 2px; margin: 0;
}
br.clear {
clear:both;
}
/*ROUNDED CORNERS*/
.rounded_STYLE
{
background-color: white; /* if needed */
border: 25px solid #FFFFFF; /* if needed */
-webkit-border-radius: 25px; /* for Safari */
-moz-border-radius: 25px; /* for Firefox */
margin: 0 0 25px 0;
}
/*ROUNDED CORNERS*/
p{ margin: 0}
--------------------------------------------------------
IE only CSS:
@charset "utf-8";
/* CSS Document */
div#wrapper {
background:none;
filter
rogid
XImageTransform.Microsoft.AlphaImageLoader(src='colhead-tl.png' ,sizingMethod='crop');
}
.nav {
margin-top:49px;
}
.rounded_STYLE
{
background-color: white; /* if needed */
border: 25px solid white; /* if needed */
position: relative;
}
.rounded_STYLE > .tl, .rounded_STYLE > .tr, .rounded_STYLE > .bl, .rounded_STYLE > .br
{
width: 25px;
height: 25px;
position: absolute;
}
.rounded_STYLE > .tl
{
background: url(../images/colhead-tl.jpg) top left no-repeat;
top: -25px;
left: -25px;
}
.rounded_STYLE > .tr
{
background: url(../images/colhead-tr.jpg) top right no-repeat;
top: -25px;
right: -25px;
}
.rounded_STYLE > .bl
{
background: url(../images/colhead-bl.jpg) bottom left no-repeat;
bottom: -25px;
left: -25px;
}
.rounded_STYLE > .br
{
background: url(../images/colhead-br.jpg) bottom right no-repeat;
bottom: -25px;
right: -25px;
}
--------------------------------------------------------
Any help would be great,
Thanks,
JTN
http://www.thenserenity.com/form.html
i have 2 css files, 1 basic (for all browsers) and 1 for IE:
--------------------------------------------------------
basic css:
@charset "utf-8";
/* CSS Document */
body {
background-image: url(../images/background_gradiant.jpg);
background-repeat:repeat-x;
background-color:#ccccfe;
font-family:Arial, Helvetica, sans-serif;
margin:0;
padding:0;
border:0;
}
#header {
width:800px;
height:191px;
margin-top: 25px;
margin-left:auto;
margin-right:auto;
background-image:url(../images/logo-top.png);
}
/*Testimonials*/
#header-bottom1 {
width:800px;
height:83px;
margin-left:auto;
margin-right:auto;
background-image:url(../images/logo-bottom1.png);
}
#header-bottom2 {
width:800px;
height:83px;
margin-left:auto;
margin-right:auto;
background-image:url(../images/logo-bottom2.png);
}
#header-bottom3 {
width:800px;
height:83px;
margin-left:auto;
margin-right:auto;
background-image:url(../images/logo-bottom3.png);
}
/*Testimonials*/
#nav-wrap {
width:820px;
height:100%;
margin-left:auto;
margin-right:auto;
}
.nav {
width: 163px;
height: 120px;
position: absolute;
z-index: 50;
clear: both;
margin-top:74px;
}
#wrapper {
width:800px;
height:100%;
margin-left:auto;
margin-right:auto;
margin-top:25px;
}
.photoleft {float: left; padding:0px 10px 0px 2px; margin: 0;
}
br.clear {
clear:both;
}
/*ROUNDED CORNERS*/
.rounded_STYLE
{
background-color: white; /* if needed */
border: 25px solid #FFFFFF; /* if needed */
-webkit-border-radius: 25px; /* for Safari */
-moz-border-radius: 25px; /* for Firefox */
margin: 0 0 25px 0;
}
/*ROUNDED CORNERS*/
p{ margin: 0}
--------------------------------------------------------
IE only CSS:
@charset "utf-8";
/* CSS Document */
div#wrapper {
background:none;
filter
}
.nav {
margin-top:49px;
}
.rounded_STYLE
{
background-color: white; /* if needed */
border: 25px solid white; /* if needed */
position: relative;
}
.rounded_STYLE > .tl, .rounded_STYLE > .tr, .rounded_STYLE > .bl, .rounded_STYLE > .br
{
width: 25px;
height: 25px;
position: absolute;
}
.rounded_STYLE > .tl
{
background: url(../images/colhead-tl.jpg) top left no-repeat;
top: -25px;
left: -25px;
}
.rounded_STYLE > .tr
{
background: url(../images/colhead-tr.jpg) top right no-repeat;
top: -25px;
right: -25px;
}
.rounded_STYLE > .bl
{
background: url(../images/colhead-bl.jpg) bottom left no-repeat;
bottom: -25px;
left: -25px;
}
.rounded_STYLE > .br
{
background: url(../images/colhead-br.jpg) bottom right no-repeat;
bottom: -25px;
right: -25px;
}
--------------------------------------------------------
Any help would be great,
Thanks,
JTN