• Jetzt anmelden. Es dauert nur 2 Minuten und ist kostenlos!

PHASE 5 Browser Problem

H

henry4200

Neues Mitglied
Hey Leute, ich bin relativ neu im Bereich HTML und habe ein paar Fragen zur Wiedergabe von HTML-Seiten in Browsern. Und zwar schreibe ich meine Seiten mit dem Programm Phase 5. Dieses Programm benutzt ja einen eigenen Browser den man ganz schnell oben rechts aufrufen kann um seine erstellte Seite zu betrachten. In diesem Browser sieht meine Seite absolut so aus wie ich es möchte. Öffne ich aber diese Seite in Browsern wie Chrome, Internet Explorer oder Opera (alle in der aktuellsten Version) sind einige Elemente verschoben. Meistens sind es DIV-Container die verrutscht sind.
Wäre cool wenn jemand eine Lösung für das Problem findet. Danke schon mal :)

Ach und in meiner Schule auf den Rechnern funktioniert es... (Der Computer der Schule und meiner läuft mit Windows 7, die Version des Browsers in der Schule ist allerdings etwas älter (Firefox (mit dem hab ich es zuhause auch probiert...)).
 
Falls ihr über das Theam der Website wundert: das ist ein Schulprojekt :)

Das ist die Startseite:

<html>

<head>
<title>Startseite</title>
<link rel="stylesheet" href="texte/design.css" type="text/css">
</head>


<body>
<div id="website">

<div id="header">
<h1>ADOLF HITLER</h1>
</div>

<div id="main">
<div id="menue">



<h1>
<ul>
<li><a href="texte/biografie.html">Biografie</a></li>
</ul>
<ul>
<li><a href="texte/gesselschaftlicher_hintergrund.html">gesellschaftlicher Hintergrund</a></li>
</ul>
<ul>
<li><a href="texte/gruende.html">Gründe</a></li>
</ul>
<ul>
<li><a href="texte/auswirkungen.html">Auswirkungen auf sein Leben</a></li>
</ul>
<ul>
<li><a href="texte/selbstreflexion.html">Selbstreflexion</a></li>
</ul>
<ul>
<li><a href="texte/prominentenstatus.html">Prominentenstatus</a></li>
</ul>
<ul>
<li><a href="texte/vorunddanach.html">Leben vor und danach</a></li>
</ul>
<ul>
<li><a href="texte/bedingungen.html">Bedingnungen</a></li>
</ul>
<ul>
<li><a href="texte/laenderkunde.html">Länderkunde</a></li>
</ul>
<ul>
<li><a href="index.html">Startseite</a></li>
</ul>
</h1>



</div>
<div id="textindex">
<img src="bilder/titel.jpg" alt="" border="0" width="615" height="345">
</div>
<div id="fusszeileindex">
Hitler als Emigrant.
</div>
</div>

</div>
</body>

</html>


Und das ist die CSS Datei:


body
{background-color:#9E9E9E;
text-align:center;}

#website
{width:980px;
margin:0 auto;}

#header
{margin-top: 10px;
width:980px;
height:180px;
background-color:#795548;}


#header h1
{padding-top: 50px;
font-size: 60px;
font-weight: bold;
font-family: Calibri;
color: #3E2723;}

#main
{width: 980px;}

#menue
{float: left;
width: 300px;
height: 400px;
background:#795548;
margin-top: 10px;
margin-bottom: 15px;}


#menue h1
{font-family: Calibri;
font-size: 15px;
color:#3E2723;
text-align: left;
padding-top: 1px;
padding-bottom: 0px;}

#menuebottom
{position: relative;
width: 200px;
height: 200px;
bottom: 0px;
left:0px;
background:#795548;}


#text
{padding-top: 20px;
padding-bottom: 20px;
text-align: left;
font-size: 15px;
font-family:Calibri;
color:#3E2723;
float:right;
width:670px;
height:400px;
background:#795548;
margin-left:10px;
margin-top:10px;}

#textindex
{float:right;
width:670px;
height:400px;
background:#9E9E9E;
margin-left:10px;
margin-top: 10px;}

#textindex img
{width:670px;
height:400px;}

#fusszeileindex
{margin-top: 10px;
width: 980px;
height: 80px;
background:#795548;
font-size: 25px;
font-family: Calibri;
color:#3E2723;
padding-top: 20px;}

#fusszeile
{margin-top: 10px;
width: 980px;
height: 80px;
background:#795548;
font-size: 25px;
font-family: Calibri;
color:#3E2723;
padding-top: 20px;}
 
Zuletzt bearbeitet:
Resette mal am anfang der Css per:

Code: 
* {
margin: 0;
padding: 0;
}

alle browserspezifischen Abstände die vordefiniert sind.
Nachher wirst du vermutlich die margins/paddings neu nachbessern müssen,
hast aber in allen Browser eine fast gleiche Darstellung.

mfg Nita
 
Du musst dich einloggen oder registrieren, um hier zu antworten.

Neueste Beiträge

Zurück
Oben