/    Sign up×
Community /Pin to ProfileBookmark

[RESOLVED] Browser Displays Webpage Wrong

Ok I started to make my first webpage yesterday and so for [url]www.xemux.com[/url] is all I got.

In Opera it displays it fine, but in Firefox and IE there is a big gap at the top (between the table of new games and the black logo).

If anyone could help fix the problem it would be appreciated. ?

Here is the code:

[CODE]<!DOCTYPE html PUBLIC “-//W3C//DTD XHTML 1.0 Transitional//EN” “http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd”>
<html xmlns=”http://www.w3.org/1999/xhtml”>
<head>
<meta http-equiv=”Content-Type” content=”text/html; charset=ISO-8859-1″ />
<title>XeMuX Game Portal</title>
<style type=”text/css”>
<!–
.style1 {
color: #E41D10;
font-weight: bold;
}
–>
</style>
<style type=”text/css”>
<!–

a {text-decoration: none; }
.style7 {font-weight: bold; color: #FFFFFF;}
.style8 {color: #000000}
.style11 {color: #FFFFFF}

–>
</style>
</head>

<body>
<center>
<table width=”100%” height=”125″ border=”0″ align=”left”>
<tr>
<td height=”121″ bgcolor=”#000000″><img src=”/images/icon.png” align=”left”></td>
</tr>
</table>
<h1 align=”left” class=”style1″>&nbsp;</h1>
<p class=”style1″>&nbsp;</p>
<p class=”style1″>&nbsp;</p>
<p class=”style1 style8″>New Weekly Games: </p>
<table width=”120″ height=”600″ border=”0″ align=”right”>
<tr>
<td><script type=”text/javascript”><!–
google_ad_client = “pub-4187738601117094”;
google_ad_width = 120;
google_ad_height = 600;
google_ad_format = “120x600_as”;
google_ad_type = “text_image”;
google_ad_channel =””;
google_color_border = “000000”;
google_color_bg = “FFFFFF”;
google_color_link = “0000FF”;
google_color_text = “000000”;
google_color_url = “008000”;
//–></script>
<script type=”text/javascript”
src=”http://pagead2.googlesyndication.com/pagead/show_ads.js”>
</script></td>
</tr>
</table>
<table width=”120″ border=”0″ align=”left”>
<tr>
<td><span class=”style8″><strong>Navigation</strong></span></td>
</tr>
<tr>
<td bgcolor=”#000000″><a href=”/submit.html” class=”style11″>Submit a Game</a></td>
</tr>
<tr>
<td>&nbsp;</td>
</tr>
<tr>
<td>&nbsp;</td>
</tr>
<tr>
<td>&nbsp;</td>
</tr>
<tr>
<td>&nbsp;</td>
</tr>
<tr>
<td>&nbsp;</td>
</tr>
<tr>
<td>&nbsp;</td>
</tr>
<tr>
<td>&nbsp;</td>
</tr>
<tr>
<td>&nbsp;</td>
</tr>
<tr>
<td>&nbsp;</td>
</tr>
<tr>
<td>&nbsp;</td>
</tr>
<tr>
<td>&nbsp;</td>
</tr>
<tr>
<td>&nbsp;</td>
</tr>
<tr>
<td>&nbsp;</td>
</tr>
<tr>
<td>&nbsp;</td>
</tr>
<tr>
<td>&nbsp;</td>
</tr>
<tr>
<td>&nbsp;</td>
</tr>
<tr>
<td>&nbsp;</td>
</tr>
<tr>
<td>&nbsp;</td>
</tr>
<tr>
<td>&nbsp;</td>
</tr>
<tr>
<td>&nbsp;</td>
</tr>
<tr>
<td>&nbsp;</td>
</tr>
<tr>
<td>&nbsp;</td>
</tr>
<tr>
<td>&nbsp;</td>
</tr>
<tr>
<td>&nbsp;</td>
</tr>
<tr>
<td>&nbsp;</td>
</tr>
</table>
</center>

<center>
<table width=”660″ height=”310″ border=”1″ align=”center” bordercolor=”#6666FF” bgcolor=”#333399″>
<tr>
<td width=”158″ height=”148″><p align=”center”><a href=”/helicoptergame.html”><img src=”/images/heliup.jpg” width=”100″ height=”100″ border=”0″ /></a></p>
<p align=”center”><strong>Helicopter Game </strong></p></td>
<td width=”158″ height=”148″><p align=”center”><a href=”/bushshootout.html”><img src=”/images/bushshootout.jpg” width=”100″ height=”100″ border=”0″ /></a></p>
<p align=”center”><strong>Bush Shoot Out</strong></p></td>
<td width=”158″ height=”148″><p align=”center”><a href=”/lootieworld.html”><img src=”/images/lootieworld.jpg” width=”100″ height=”100″ border=”0″ /></a></p>
<p align=”center”><strong>Lootie World</strong></p></td>
<td width=”158″ height=”148″><p align=”center”><a href=”/territorywar.html”><img src=”/images/territorywar.jpg” width=”100″ height=”100″ border=”0″ /></a></p>
<p align=”center”><strong>Territory War</strong></p></td>
</tr>
<tr>
<td width=”158″ height=”148″><p align=”center”><a href=”/bowman2.html”><img src=”/images/bowman2.jpg” width=”100″ height=”100″ border=”0″ /></a></p>
<p align=”center”><strong>Bowman 2</strong></p></td>
<td width=”158″ height=”148″><p align=”center”><a href=”/powerfox3.html”><img src=”/images/powerfox3.jpg” width=”100″ height=”100″ border=”0″ /></a></p>
<p align=”center”><strong>Powerfox 3</strong></p></td>
<td width=”158″ height=”148″><p align=”center”><a href=”/wOne.html”><img src=”/images/wOne.jpg” width=”100″ height=”100″ border=”0″ /></a></p>
<p align=”center”><strong>wOne</strong></p></td>
<td width=”158″ height=”148″><p align=”center”><a href=”/rage.html”><img src=”/images/rage.jpg” width=”100″ height=”100″ border=”0″ /></a></p>
<p align=”center”><strong>Rage</strong></p></td>
</tr>
</table>
<p>Full Games List: </p>
</center>
<center><table width=”660″ border=”0″ align=”center”>
<tr>
<td width=”165″ bgcolor=”#000000″ class=”style7″><div align=”center”>Action</div></td>
<td width=”165″ bgcolor=”#000000″><div align=”center” class=”style7″>Shooters</div></td>
<td width=”165″ bgcolor=”#000000″><div align=”center”><span class=”style7″>Classics/Arcade</span> </div></td>
<td width=”165″ bgcolor=”#000000″>&nbsp;</td>
</tr>
<tr>
<td><div align=”left”><a href=”/ogg.html” class=”style8″>Ogg</a></div></td>
<td><div align=”left”><a href=”/tacticalassasin.html” class=”style8″>Tactical Assasin</a></div></td>
<td><a href=”/helicoptergame.html” class=”style8″>Helicopter Game</a></td>
<td>&nbsp;</td>
</tr>
<tr>
<td><a href=”/bowman2.html” class=”style8″>Bowman 2</a></td>
<td>&nbsp;</td>
<td>&nbsp;</td>
<td>&nbsp;</td>
</tr>
<tr>
<td>&nbsp;</td>
<td>&nbsp;</td>
<td>&nbsp;</td>
<td>&nbsp;</td>
</tr>
<tr>
<td>&nbsp;</td>
<td>&nbsp;</td>
<td>&nbsp;</td>
<td>&nbsp;</td>
</tr>
<tr>
<td>&nbsp;</td>
<td>&nbsp;</td>
<td>&nbsp;</td>
<td>&nbsp;</td>
</tr>
<tr>
<td>&nbsp;</td>
<td>&nbsp;</td>
<td>&nbsp;</td>
<td>&nbsp;</td>
</tr>
<tr>
<td>&nbsp;</td>
<td>&nbsp;</td>
<td>&nbsp;</td>
<td>&nbsp;</td>
</tr>
<tr>
<td>&nbsp;</td>
<td>&nbsp;</td>
<td>&nbsp;</td>
<td>&nbsp;</td>
</tr>
<tr>
<td>&nbsp;</td>
<td>&nbsp;</td>
<td>&nbsp;</td>
<td>&nbsp;</td>
</tr>
</table>
</center>
<p>&nbsp;</p>
</body>
</html>[/CODE]

to post a comment
HTML

6 Comments(s)

Copy linkTweet thisAlerts:
@CentauriJul 07.2006 — With the empty h1 and p tags between the two tables, I am not surprised there is a gap.

Also, why use tables to lay this out?
Copy linkTweet thisAlerts:
@RodevauthorJul 07.2006 — With the empty h1 and p tags between the two tables, I am not surprised there is a gap.

Also, why use tables to lay this out?[/QUOTE]


I tried removing even just the h1 and the text went up next to the icon. So then I put the h1 back and tried removing one of the p tags and that didnt work either... :mad:

And whats wrong with tables? (this is my first website ? )
Copy linkTweet thisAlerts:
@NogDogJul 07.2006 — [url=http://www.hotdesign.com/seybold/]What's wrong with tables[/url]
Copy linkTweet thisAlerts:
@RodevauthorJul 07.2006 — Ok well tables may not be the best but I am sticking with it for now, can anyone help me with my problem?
Copy linkTweet thisAlerts:
@CentauriJul 07.2006 — Replace the h1 and p tags with a div set clear:both

ie

<div style="clear:both"></div>

Cheers

Graeme
Copy linkTweet thisAlerts:
@RodevauthorJul 07.2006 — <3 Thanks very much.
×

Success!

Help @Rodev spread the word by sharing this article on Twitter...

Tweet This
Sign in
Forgot password?
Sign in with TwitchSign in with GithubCreate Account
about: ({
version: 0.1.9 BETA 6.16,
whats_new: community page,
up_next: more Davinci•003 tasks,
coming_soon: events calendar,
social: @webDeveloperHQ
});

legal: ({
terms: of use,
privacy: policy
});
changelog: (
version: 0.1.9,
notes: added community page

version: 0.1.8,
notes: added Davinci•003

version: 0.1.7,
notes: upvote answers to bounties

version: 0.1.6,
notes: article editor refresh
)...
recent_tips: (
tipper: @nearjob,
tipped: article
amount: 1000 SATS,

tipper: @meenaratha,
tipped: article
amount: 1000 SATS,

tipper: @meenaratha,
tipped: article
amount: 1000 SATS,
)...