Vraag weergeven firefox

Door Midas op 11-05-2008 09:02

557 views

Goeiemorgen allemaal,

Sorry dat ik jullie stoor met mijn prangende vraag.
Maar ik wist niet echt waar ik anders zou heen moeten.
Maar goed, even terzake.
Mijn website loopt kwa layout perfect in internet explorer.
Maar wanneer ik het open via firefox verschuiven er allerlij vakken.
Zoals je ziet op onderstaande screen :

Even ook mijn 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>TAATUsafe</title>
<link href="stylesheet.css" rel="stylesheet" type="text/css" />
</head>
<body>
<div id="total">
<div id="header">
</div>
<div id="navigatiebalk">
<b><FONT SIZE="2"><FONT FACE="verdana"><a href='index.htm'>Home</a></FONT></FONT></b>

<b><FONT SIZE="2"><FONT FACE="verdana"><a href='nieuws.htm'>Nieuws</a></FONT></FONT></b>

<b><FONT SIZE="2"><FONT FACE="verdana"><a href='taatu.htm'>TAATU</a></FONT></FONT></b>

<b><FONT SIZE="2"><FONT FACE="verdana">T-Woordenboek</FONT></FONT></b>

<b><FONT SIZE="2"><FONT FACE="verdana">Problemen/vragen</FONT></FONT></b>

<b><FONT SIZE="2"><FONT FACE="verdana">Verslagen</FONT></FONT></b>

<b><FONT SIZE="2"><FONT FACE="verdana">Met dank</FONT></FONT></b>

<b><FONT SIZE="2"><FONT FACE="verdana">Links</FONT></FONT></b>

<b><FONT SIZE="2"><FONT FACE="verdana">Contact</FONT></FONT></b>

</div>
<div id="leftContent">
<div id="title"><p style="margin: 0"><b><font face="Verdana" size="2" color="#FFFFFF">Snelle links</font></b></p></div>
<div id="text"><b><a href='nieuws.htm'>Nieuws</a></b></div>
<div id="text"><b><a href='metdank.htm'>Met dank aan</a></b></div>
<div id="text"><b><a href='metdank.htm'>Contact</a></b></div>
</div>
<div id="centerContent">
<p><font face="Verdana" size="4" color="#D7D7D7">Welkom op TAATUsafe</font><br>
<font face="Verdana" size="2">TAATUsafe is een fansite van de virtuele wereld
TAATU.<br>
Op deze website kan je hierover allerlei informatie verzamelen en handige
weetjes op doen.<br>
<br>
Naast het informatieve gedeelte over TAATU, bied TAATUsafe ook op de website
allerlei onderdelen die hulp bij problemen kunnen geven.<br>
Kijk dus snel even rond en geniet van de website !</font></p>
<br>
<iframe src="nieuws/index.php" frameborder="0" width="100%" height="300px"></iframe>
<br />
</p>
</div>
</div>
<div id="footer">Copyright TAATUsafe 2008
</div>
</div>
</body>
</html>

Weet iemand wat er in deze code moet verranderd worden ?
Alvast bedankt.

Mvg,
Midas

TJVB tvb

11-05-2008 09:46

Aan deze code zelf hebben we niet genoeg, het zou handig zijn om ook het .css file te geven (of een link naar een online voorbeeld)

Je code is verder ook niet validated.

En tijdens het ontwikkelen is het vaak handiger om eerst in firefox/safari/opera te werken en daarna dingen aan te passen zodat het ook in internet explorer werkt.

Midas

11-05-2008 09:52

Dit is mijn css code :

body {
text-align: center;
font-family: Arial, Helvetica, sans-serif;
font-size: 11px;
background-color: #333333;
margin: 0;
}
#title {
background-color: #D1D1D1;
color: #000000;
font-family: Verdana;
font-size: 11px;
text-align: center;
}
#text {
background-color: #E8E8E8;
color: #000000;
font-family: Verdana;
font-size: 11px;
}
#total {
background-color: #FFFFCC;
width: 800px;
margin-right: auto;
margin-left: auto;
text-align: left;
}
#header {
background-image: url('Untitled-12.gif');
height: 235px;
width: 800px;
text-align: center;
background-color: #999999;
}
#navigatiebalk {
height: 20px;
width: 800px;
text-align: center;
background-color: #FFFFCC;
}
#leftContent {
width: 160px;
float: left;
background-color: #FFFFCC;
padding: 5px;
}
#centerContent {
float: left;
width: 603px;
height: 475px;
padding: 5px;
background-color: #FFFFCC;
}
#footer {
font-size: 10px;
color: #333333;
height: 14px;
width: 800px;
clear:both;
text-align: center;
background-color: #FFFFCC;
}
p {
padding: 0px;
margin-top: 5px;
margin-bottom: 7px;
margin-right: 0px;
margin-left: 0px;
}
h1 {
font-size: 36px;
font-weight: bold;
margin-top: 0px;
margin-right: 0px;
margin-bottom: 0px;
margin-left: 0px;
padding-top: 10px;
padding-right: 0px;
padding-bottom: 10px;
padding-left: 0px;}
a:link {
color: #000000;
text-decoration: none;
}

a:visited {
color: #000000;
text-decoration: none;
}

a:hover {
color: #123456;
}

Ik hoop dat iemand hiermee mijn probleem kan oplossen ?

Paul K

11-05-2008 12:13

Ik zou eerst een beetje je html verbeteren, je gebruikt nog oerhtml(font)

Allemaal door die dingen word je html ook erg vaag ;)

Robert Deiman

11-05-2008 12:18

Het is overigens beter om de lay-out eerst in Firefox te maken, of nog beter in Opera of in Safari. Deze browsers houden zich beter aan de standaarden, je hebt ook IE hacks en niet FF hacks.

Midas

11-05-2008 18:22

Bedankt voor de reacties.
Maar ik heb er helaas niet zoveel aan.
Ik weet dat ik ondertussen beter eerst met FF kan werken dan met IE.
Maar daar valt nu niks meer aan te verranderen.
Is er niemand die het antwoord op mijn probleem kan geven ?

Joren de Wit

11-05-2008 18:51

Wat betreft je layout: met 2 kleine aanpassingen kun je die er in FF en Safari wel prima uit laten zien.

1. Geef je div#total een 'overflow:hidden' mee.
2. Geef je div#footer een 'margin: 0 auto' mee.

Maar goed, dat neemt natuurlijk niet weg dat de rest van je HTML code ook wel redelijk drama is. Om te beginnen zou je eerst eens alle <font> tags eruit moeten slopen. Die stamt nog uit de middeleeuwen, tegenwoordig gebruiken we ook daar gewoon CSS voor...

Midas

12-05-2008 01:33

Het werkt helemaal dankjewel Blanche.
Naar dit antwoord heb ik +- 3 dagen gezocht op het internet.
Maar nog een kleine vraag :
Hoe kan je je font script eenvoudiger verwerken in het css script ?

Reageren

Inloggen om te reageren