Hello everyone,
I'm having a bit of a problem with an image positioning and then page looking different in IE/FF. First off, the image on this page
www.mommyandmimi.com/123456.htm I would like to have centered in that right area. The size is correct, I just can't get it centered. Next, text jumps way over when opened in Firefox, its fine in IE. If anybody could give me some insight I would love it. Thanks, and here is the
CSS code:
- Code: Select all
body {
margin: 0px;
background-color: #06182A;
font-family: "Courier New", Courier, monospace;
}
body, td, div, p {
/* IE fix */
font-size: 12px;
}
#page {
width: 890px;
margin: 0 auto 0 auto;
}
tr.odd {
background-color: #DDDDDD;
}
tr.even { }
td {
vertical-align: top;
}
td.number, th.number {
text-align: right;
}
th {
text-align: left;
vertical-align: bottom;
}
a {
color: #CC6600;
text-decoration: none;
font-weight: bold;
}
a:visited {
color: #993300; /* Slightly darker than unvisited */
}
a:hover {
text-decoration: underline;
}
h1 {
margin-top: 10px;
margin-bottom: 5px;
font-size: 18px;
}
h2 {
margin-top: 7px;
margin-bottom: 2px;
font-size: 14px;
}
p {
margin-top: 5px;
margin-bottom: 5px;
}
form {
/* IE fix */
margin: 0px;
}
img {
border: 0px;
}
ul {
margin-top: 0px;
padding-top: 0px;
}
#menu {
background: url(../images/seam.gif);
background-repeat: repeat-x;
height: 30px;
padding-top: 10px;
padding-bottom: 10px;
}
#menu #logo {
float:left;
}
#menu #items {
margin-left: 15px;
padding-top: 3px;
float: right;
}
#menu img.divider, #footer img.divider {
margin-left: 3px;
margin-right: 3px;
}
.submenu {
padding-top: 10px;
padding-left: 15px;
letter-spacing: -1px;
}
.submenu a {
margin-right: 0px;
margin-left: 0px;
font-size: 11px;
}
.content {
/* The main content area */
background-color: white;
}
.content-box {
/* Used around the left column of the content to create a scroll if necessary */
width: 410px;
height: 435px;
margin-left: 15px;
overflow: auto;
}
.content-side {
height: 440px;
margin-top: 10px;
padding-right: 10px;
float: right;
}
.small {
font-size: 90%;
}
.text {
margin-top: 2px;
margin-bottom: 2px;
line-height: 150%;
}
.error {
color: #CC0000;
}
.right-align {
float: right;
}
.left-align {
float: left;
}
#footer {
padding-top: 2px;
/* padding-left: 10px;
padding-right: 10px;*/
}
.movie-info {
margin-top: 15px;
}
.movie-poster {
float: left;
margin-right: 5px;
border: 1px solid black;
}