Hi All -
I am not a professional web person - but I do try to maintain my own websites. I have hit a stumbling block in which I am pulling what little hair I have out!
I am trying to bring up a new site at http://www.tucsonrealpros.com In addition, I have some IDX (Multiple Listing Service Search) frames that I need to do a whole bunch of pages similar to http://www.tucsonrealpros.com/search.html It looks good in firefox, chrome, safari, but in IE the frame starts way down on the page.
I have validated and come up with some alt tags that need some work, but don't think that would have an effect on what is going on. My css code is:
@charset "utf-8";
/ CSS for TucsonRealPro.com /
body {
margin:0;
padding:0;
background-color:#ffffff;
color:#000000;
font-family:Arial, Helvetica, sans-serif;
font-size:90%;
}
#wrapper {
background-color:#C5A97F;
color:#000000;
margin:30px 40px 30px 40px;
padding:10px;
}
#header p {
float:left;
margin-left:1em;
}
#header h2 {
text-align:center;
font-size:140%;
}
#header-bottom h1 {
font-size:140%;
text-indent: -9999px;
}
#header p {
font-size:90%;
color:white;
margin:0;
}
#header img {
margin:1em;
}
#main {
width:100%;
margin-top:10px;
}
#main2 {
background-image:url(img/leftbg.gif);
background-position:bottom;
background-repeat:repeat-y;
}
#mainfeature {
padding:0;
background-repeat:no-repeat;
height:300px;
background-color:#FFFFFF;
overflow:hidden;
}
#content {
margin:0 240px 0 160px;
border:1px solid #C2B59B;
background-color:#F6E8D6;
color:black;
}
#content .inner {
margin:10px 20px 10px 40px;
}
#content .inner img {
float:left;
padding:10px;
margin:10px;
}
#content .inner p {
font-family:Arial, Helvetica, sans-serif;
color:#333333;
font-size:90%;
line-height:1.5em;
}
#content .inner h2 {
color:white;
padding-bottom:0.2em;
font-family:"Times New Roman", Times, serif;
letter-spacing:0.7em;
font-size:140%;
background-color:#6A4F34;
border-left: 12px solid #FFCC66;
text-align:center;
}
#content .inner h3 {
color:white;
padding-bottom:0.2em;
font-family:Arial, Helvetica, sans-serif;
letter-spacing:0.2em;
font-size:120%;
background-color:#7E8FB1;
text-align:center;
}
#content .inner h4 {
color:white;
padding-bottom:0.2em;
font-family:Arial, Helvetica, sans-serif;
letter-spacing:0.2em;
font-size:100%;
background-color:#6A4F34;
text-align:center;
}
#sidebar {
float:right;
width:220px;
background-color:#C2B59B;
border:1px solid #6A4F34;
color:black;
margin:0;
padding:0;
}
#sidebar .inner {
padding:10px;
}
#sidebar h3 {
background-color:#5CA444;
color:white;
font-size:90%;
padding:5px;
text-align:center;
}
#sidebar2 {
float: left;
width:159px;
border:1px solid #6A4F34;
background-color:#ffffff;
color:black;
margin:0;
padding:0;
}
#sidebar2 .inner {
padding:10px;
}
#sidebar2 h2 {
font-size: 90%;
color:white;
background-color:#6a4f34;
text-align:center;
}
#sidebar2 h3 {
font-size: 90%;
color:white;
background-color:#7E8FB1;
text-align:center;
}
#sidebar2 p {
font-size:90%;
color:black;
line-height:1.5em;
text-align:left;
}
#navigation {
font-size:90%;
overflow:hidden;
}
#footer {
width:100%;
background-color:#6A4F34;
border:1px solid #C2B59B;
margin-top:10px;
clear:both;
}
#footer p {
text-align:center;
font-size:90%;
color:#ffffff;
}
#clearone {
clear:both;
height:1px;
}
.gallerycontainer{
position:relative;
height:300px;
/Add a height attribute and set to largest image's height to prevent overlaying/
}
.thumbnail img{
border: 1px solid white;
margin: 0 5px 5px 0;
display:inline;
}
.thumbnail:hover{
background-color: transparent;
}
.thumbnail:hover img{
border: 1px solid #c2b59b;
}
.thumbnail span{ /CSS for enlarged image/
position: absolute;
background-color: #F6E8D6;
padding: 5px;
left: -1000px;
border: 1px dashed gray;
visibility: hidden;
color: black;
text-decoration: none;
}
.thumbnail span img{ /CSS for enlarged image/
border-width: 0;
padding: 2px;
}
.thumbnail:hover span{ /CSS for enlarged image/
visibility: visible;
top: 0;
left: 230px; /position where enlarged image should offset horizontally /
z-index: 50;
}
#nav{
width: 200px; }
#nav ul {
list-style: none;
margin: 0;
padding: 0;
}
#nav li {
border-bottom: 1px solid #ffffff;
}
#nav li a:link, #nav li a:visited {
font-size: 90%;
display: block;
padding: 0.4em 0 0.4em 0.5em;
border-left: 12px solid #6A4F34;
border-right: 1px solid #6A4F34;
background-color: #C5A97F;
color: #FFFFFF;
text-decoration: none;
}
#nav li a:hover {
background-color: #6A4F34;
color: #FFFFFF;
}
* html #nav li a {
width: 100%;
}
#searchform .text {
width: 196px;
border: 1px solid #996633;
}
#searchform .searchbutton {
text-align: left;
margin-top: 4px;
}
#searchform .btn {
border: 1px solid #996633;
background-color: #256290;
color:white;
}
Please HELP!! Thanks!!!!
