Printable View
Okay, I made a new intro page for our website. And in FireFox it looks just fine. But in Internet Explorer, theres a weird line in the middle, and I can't figure out why it's like that.
Here's the site. Look at it with Firefox and IE. Maybe someone knows.
Note: After my problems is fixed, I'll remove the link so it won't be advertising.Code:http://rosereborn.com/home.html
Remove theI think its thatQuote:
home_images/spacer.gif
well you have a lot of errors in your page
make it valid Html/Xhtml and it should go away
Quote:
W3 team
Markup Validation Service v0.7.4
Home About... News Docs Help & FAQ Feedback
Jump To:
ResultsResult: Failed validation, 11 errors
File: home.html
Encoding: iso-8859-1
Doctype: (no Doctype found)
No DOCTYPE found! Attempting validation with HTML 4.01 Transitional.
The DOCTYPE Declaration was not recognized or is missing. This probably means that the Formal Public Identifier contains a spelling error, or that the Declaration is not using correct syntax. Validation has been performed using a default "fallback" Document Type Definition that closely resembles "HTML 4.01 Transitional", but the document will not be Valid until you have corrected this problem with the DOCTYPE Declaration.
Learn how to add a doctype to your document from our FAQ.
This page is not Valid (no Doctype found)!
Below are the results of attempting to parse this document with an SGML parser.
Error Line 1 column 0: no document type declaration; implying "<!DOCTYPE HTML SYSTEM>".
<html>
The checked page did not contain a document type ("DOCTYPE") declaration. The Validator has tried to validate with a fallback DTD, but this is quite likely to be incorrect and will generate a large number of incorrect error messages. It is highly recommended that you insert the proper DOCTYPE declaration in your document -- instructions for doing this are given above -- and it is necessary to have this declaration before the page can be declared to be valid.
✉
Error Line 6 column 95: there is no attribute "LEFTMARGIN".
...reenfox/misc/bg_tile.gif" leftmargin="0" topmargin="0" marginwidth="0" margin
You have used the attribute named above in your document, but the document type you are using does not support that attribute for this element. This error is often caused by incorrect use of the "Strict" document type with a document that uses frames (e.g. you must use the "Transitional" document type to get the "target" attribute), or by using vendor proprietary extensions such as "marginheight" (this is usually fixed by using CSS to achieve the desired effect instead).
This error may also result if the element itself is not supported in the document type you are using, as an undefined element will have no supported attributes; in this case, see the element-undefined error message for further information.
How to fix: check the spelling and case of the element and attribute, (Remember XHTML is all lower-case) and/or check that they are both allowed in the chosen document type, and/or use CSS instead of this attribute. If you received this error when using the <embed> element to incorporate flash media in a Web page, see the FAQ item on valid flash.
✉
Error Line 6 column 109: there is no attribute "TOPMARGIN".
...g_tile.gif" leftmargin="0" topmargin="0" marginwidth="0" marginheight="0">
✉
Error Line 6 column 125: there is no attribute "MARGINWIDTH".
...margin="0" topmargin="0" marginwidth="0" marginheight="0">
✉
Error Line 6 column 142: there is no attribute "MARGINHEIGHT".
...gin="0" marginwidth="0" marginheight="0">
✉
Error Line 8 column 40: there is no attribute "HEIGHT".
<table id="Table_01" width="780" height="501" border="0" cellpadding="0" cellspa
✉
Error Line 20 column 272: duplicate specification of attribute "BORDER".
...ge_03.gif'" alt="" border="0" border="0"></a>
You have specified an attribute more than once. For instance, you have used the "height" attribute twice on the same "img" tag.
✉
Error Line 25 column 261: duplicate specification of attribute "BORDER".
...ge_05.gif'" alt="" border="0" border="0"></a></td>
✉
Error Line 29 column 263: duplicate specification of attribute "BORDER".
...ge_07.gif'" alt="" border="0" border="0"></a></td>
✉
Error Line 57 column 218: duplicate specification of attribute "BORDER".
...ge_13.gif'" alt="" border="0" border="0"></a></td>
✉
Error Line 88 column 6: end tag for "CENTER" omitted, but its declaration does not permit this.
</body>
You forgot to close a tag, or
you used something inside this tag that was not allowed, and the validator is complaining that the tag should be closed before such content can be allowed.
The next message, "start tag was here" points to the particular instance of the tag in question); the positional indicator points to where the validator expected you to close the tag.
✉
Info Line 7 column 0: start tag was here.
<center><br><br><br><br><Br>
...do I really need to explain why inserting an image will cause its contents to be put there?PHP Code:<img src="home_images/spacer.gif" width="1" height="231" alt="" border="0">
lol. One is enough.Quote:
Error Line 57 column 218: duplicate specification of attribute "BORDER".
...ge_13.gif'" alt="" border="0" border="0"></a></td>
P.S. spacers are stupid, table elements can have heights and widths.
Actually, that spacer is 231 pixels heigh, not 1, so it can't be the cause of his problems.
Though all in all your source is a mess - I'm figuring you simply used photoshop to export it? Might be easy enough, but if you do that you'll -always- have these kind'a problems.
lol wut?Quote:
I'm figuring you simply used photoshop to export it?
Photoshop can't even write HTML correctly? That's right, it's an IMAGE EDITOR. Go figure.
The imageis your main problem... Don't put an image over the background, its cutting off the background and giving that line. It would be better to make the whole page a single image so that it wont overlay.Code:http://rosereborn.com/home_images/image_01.gif
Problem: The Image is cutting the little squares off about 1/4 the way over.
Solution: Either move the table over 4 pixels (or whatever it is..) or just make it into a single object.
hmm, well.. the images are build up a very stupid way, and the spacers made by photoshop is also dumb ;)
I suggest you build up the lines as seperate files, eventually transparent gifs/pngs. And then have the background that is repeating as a simple pattern.
It would be stupid to even try and fix that page, rather than doing a restructure, as you would be doing hacks untill you fall asleep.
I've never coded a layout without doing it the photoshop way. I can use HTML, but not code a layout with just images.
How can you best design with Photsoshop cs2?
I don't know this ^^
Remove the comments:
Code:<!-- Begin XtremeTop100 code -->
Nothing wrong with photoshop... except that it's really gay and I hate itCode:<!-- End XtremeTop100 code -->
Although this had nothing to do with it, it still sucks
Lol true photoshop is a little bit of a douche at times.Quote:
Originally Posted by Wh005h
But anyways I still think it would be better to make the background part of the image.
Or... put a border around the main image, similar to the fading white lines (those look cool) and it will cover it up, no one will see it.
now CS3 uses the dreamwaver engine to write its HTML so it comes out decent now!Quote:
Originally Posted by username1
aswell as dreamweaver can convert tables to divs!!
Yea but I use CS2 because CS3 has a few issues that I don't want to screw with.Quote:
Originally Posted by kip0130
I couldn't figure out dreamweaver. After I imported the images I couldn't move them to their correct places lol.
Dreamweaver is only an html display and it runs basically on its own engine lol which is totally different from IE or FFox or at least it appears that way.Quote:
Originally Posted by Akai
I don't use dreamweaver except for tables, a quick adjustment for alignment, and coloring my code =p
Also, how's my fix working for you? This is one of IE's stupidities coming out lol
Quote:
Originally Posted by Wh005h
Comments don't show up and don't affect the visual style.
Heres your problem if you care to listen...
Your graphic is cutting an edge onto the background, wanna see?
Here: ImageShack - Hosting :: problemdm1.png
Just make the whole page into a graphic instead of trying to display a graphic ontop of the background like your doing. Or you can adjust the table and try to make it fit correctly but that might be more of a pain than its worth.
Dreamweaver is pretty much useless for anything but that. It can help with CSS styles but... Its not exactly hard to make them yourself.Quote:
Originally Posted by Wh005h
Weird... I must have edited something else and thought it was the comments lol
Oh well, I apologize to IE for this mistake on my part lol
Wonder what it was that I edited because I went back and edited it a second time and changed nothing but the comments to double check and it fixed it...
Did seem kinda odd but now that I try it on my comp and not the school's comp it isn't fixing it.
*Wh005h feels stupid*
Well my bad... I had it for a bit there but since it was at school I don't have it anymore, w/e I did...
I'll figure it out though hehe
Quote:
Originally Posted by Wh005h
You know that kind of makes me think... Wheres the comments at? Sometimes if you put comments inside the table it adjusts itself (I have no clue why) and removing them may have fixed it. I doubt it, you probably just changed something else without even knowing it. Or you removed a space or two that shifted the image into the correct position.
No because I went back and did it again and it didn't change.
But, yah, I fixed it... changed some img alignment and tuhduhh!
Works for me... works for you? lolCode:<html><head><title>.::Rose Reborn::. - #1 Updated Server</title>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1"></head><body leftmargin="0" topmargin="0" background="home_files/bg_tile.gif" marginheight="0" marginwidth="0">
<center>
<table id="Table_01" border="0" cellpadding="0" cellspacing="0" height="600" width="800">
<tbody><tr>
<td colspan="9">
<img src="home_files/image_01.gif" alt="" height="277" width="799"></td>
<td valign="bottom">
<img src="home_files/spacer.gif" alt="" height="277" width="1"></td>
</tr>
<tr>
<td colspan="2" rowspan="5">
<img src="home_files/image_02.gif" alt="" width="312" height="169" align="bottom"></td>
<td rowspan="2" valign="bottom">
<a href="http://www.xtremetop100.com/in.php?site=1132200652" target="_blank"><img src="home_files/image_03.gif" alt="" width="65" height="37" border="0"></a></td>
<td rowspan="5">
<img src="home_files/image_04.gif" alt="" height="169" width="20"></td>
<td rowspan="3">
<a href="http://www.mmolist.nl/vote/20" title="" target="_blank"><img src="home_files/image_05.gif" alt="" border="0" height="40" width="65"></a></td>
<td colspan="4">
<img src="home_files/image_06.gif" alt="" height="1" width="337"></td>
<td>
<img src="home_files/spacer.gif" alt="" height="1" width="1"></td>
</tr>
<tr>
<td rowspan="4">
<img src="home_files/image_07.gif" alt="" height="168" width="22"></td>
<td colspan="2" rowspan="3">
<!-- Begin Gtop100 code --><a href="http://www.gtop100.com/in.php?site=9820" title="" target="_blank"><img src="home_files/image_08.gif" alt="" border="0" height="40" width="67"></a><!-- End Gtop100 code --></td>
<td rowspan="6" valign="bottom">
<img src="home_files/image_09.gif" alt="" width="248" height="321" align="bottom"></td>
<td>
<img src="home_files/spacer.gif" alt="" height="36" width="1"></td>
</tr>
<tr>
<td rowspan="3">
<img src="home_files/image_10.gif" alt="" width="65" height="132"></td>
<td>
<img src="home_files/spacer.gif" alt="" height="3" width="1"></td>
</tr>
<tr>
<td rowspan="2">
<img src="home_files/image_11.gif" alt="" height="129" width="65"></td>
<td>
<img src="home_files/spacer.gif" alt="" height="1" width="1"></td>
</tr>
<tr>
<td colspan="2">
<img src="home_files/image_12.gif" alt="" height="128" width="67"></td>
<td>
<img src="home_files/spacer.gif" alt="" height="128" width="1"></td>
</tr>
<tr>
<td rowspan="2">
<img src="home_files/image_13.gif" alt="" height="153" width="297"></td>
<td colspan="6">
<a href="http://rosereborn.com/index.php/"><img src="home_files/image_14.gif" onMouseOver="this.src='home_images/image_14_highlight.gif'" onMouseOut="this.src='home_images/image_14.gif'" alt="" border="0" height="47" width="194"></a></td>
<td rowspan="2">
<img src="home_files/image_15.gif" alt="" height="153" width="60"></td>
<td>
<img src="home_files/spacer.gif" alt="" height="47" width="1"></td>
</tr>
<tr>
<td colspan="6">
<img src="home_files/image_16.gif" alt="" height="106" width="194"></td>
<td>
<img src="home_files/spacer.gif" alt="" height="106" width="1"></td>
</tr>
<tr>
<td>
<img src="home_files/spacer.gif" alt="" height="1" width="297"></td>
<td>
<img src="home_files/spacer.gif" alt="" height="1" width="15"></td>
<td>
<img src="home_files/spacer.gif" alt="" height="1" width="65"></td>
<td>
<img src="home_files/spacer.gif" alt="" height="1" width="20"></td>
<td>
<img src="home_files/spacer.gif" alt="" height="1" width="65"></td>
<td>
<img src="home_files/spacer.gif" alt="" height="1" width="22"></td>
<td>
<img src="home_files/spacer.gif" alt="" height="1" width="7"></td>
<td>
<img src="home_files/spacer.gif" alt="" height="1" width="60"></td>
<td>
<img src="home_files/spacer.gif" alt="" height="1" width="248"></td>
<td></td>
</tr>
</tbody></table>
<!-- End ImageReady Slices -->
</center></body></html>
Annoying little shit that it was
Quote:
Originally Posted by Wh005h
Nice, works for me on both firefox and ie.