copied html into test doc and it's different to original

windows

Guest
(This occurs in IE6. not checked in FF or other) I've got this page
<!-- m --><a class="postlink" href="http://www.troupstylesclothing.com/clothes/index.html">http://www.troupstylesclothing.com/clothes/index.html</a><!-- m -->
and I've copied the html verbatum into this page
<!-- m --><a class="postlink" href="http://www.troupstylesclothing.com/clothes/test.html">http://www.troupstylesclothing.com/clothes/test.html</a><!-- m -->.
The problem is that if you open both pages in seperate browsers and look at the image on the left in index.html there are 2 spaces, above and below, the image whereas in test.html there aren't(which is how it should be) but there is no border at the bottom of the main content. Then if you refresh test.html a border appears but in it are 2px strips of the images directly above it.
If someone could have a gander at this I'd be very appreciative.
P.s. I know the mark up is terrible, it ain't mine tho.And here's the css
body {
margin: 0px;
padding: 0px;
background-color: #8F1414;
overflow:auto;
}
.tdtop {
background-color: #000000;
}
.smenu {
background-color: #BA4545;
padding: 0px;
width: 100%;
float: none;
border-bottom-width: 1px;
border-top-style: none;
border-right-style: none;
border-bottom-style: solid;
border-left-style: none;
border-bottom-color: #000000;
}
.smenulet {
font-family: Verdana, Arial, Helvetica, sans-serif;
font-size: 12px;
text-transform: uppercase;
color: #FFFFFF;
padding: 10px;
}
.bright {
border-top-width: 2px;
border-right-width: 2px;
border-bottom-width: 2px;
border-left-width: 2px;
border-right-style: solid;
border-top-color: #000000;
border-right-color: #000000;
border-bottom-color: #000000;
border-left-color: #000000;
border-top-style: none;
border-bottom-style: none;
border-left-style: none;
}
.tdmain {
background-color: #d45151;
}
.bottm {
background-color: #8f1414;
background-image: url(../img/pristina.gif);
background-repeat: no-repeat;
background-position: left top;
border-top: 2px solid #000000;
border-right: 0px solid #000000;
border-bottom: 0px solid #000000;
border-left: 0px solid #000000;
}
.mcontent {
margin: 20px 10px 10px;
font-family: Verdana, Arial, Helvetica, sans-serif;
font-size: 10px;
line-height: 150%;
color: #FFFFFF;
}

.mcontent strong {
font-size:1.3em;
text-transform:uppercase;
}
a {
color: #FFFFFF;
text-decoration: none;
}
a:hover {
color: #000000;
}
.whiteborder {
border: 1px solid #FFFFFF;
}
.clothespics {
margin: 0px 5px;
}
.counter {
vertical-align: middle;
}Thats weird. I opened them both in FF, I dont see the difference that you described, although, on index.html I can see the footer, and on test.html I cannot, yet the code is exactly the same, and they both link to the same stylesheet and everything...
I'm usually pretty good at picking out small differences and tiny things in code, but to me they are exactly the same... :SThat puzzled me for a while but I got that figured out. It's because in index I specify table height="100%" and don't in test. I've just not updated test. I did put table height into the css but then that screwed up the feedback form. I'll have to go and sort that out as well.
 
Back
Top