mediengestalter.info
FAQ :: Mitgliederliste :: MGi Team

Willkommen auf dem Portal für Mediengestalter

Aktuelles Datum und Uhrzeit: Fr 26.04.2024 11:44 Benutzername: Passwort: Auto-Login

Thema: CSS float versetzt <div> nach innen (firefox) vom 26.08.2011


Neues Thema eröffnen   Neue Antwort erstellen MGi Foren-Übersicht -> Allgemeines - Nonprint -> CSS float versetzt <div> nach innen (firefox)
Autor Nachricht
Surras
Threadersteller

Dabei seit: 26.08.2011
Ort: -
Alter: -
Geschlecht: -
Verfasst Fr 26.08.2011 15:16
Titel

CSS float versetzt <div> nach innen (firefox)

Antworten mit Zitat Zum Seitenanfang

Hi Leute, nachdem ich ja sonst schon oft hier im Forum gelesen habe hab ich mich jetzt auch mal angemeldet, nachdem ich schon eine Weile Google und Co. umgekrempelt habe und leider nichts passendes gefunden hab.

So, folgendes Problem: wenn ich mir mittels <div>-Container ein Layout zusammenklicke,

Code:
<html>
<title>home</title>
<head>
<link href="style.css" type="text/css" rel="stylesheet">
</head>
<body>
 <div id="layout">
  <div id="header">Kopf</div>
  <div id="menu">Linkleiste</div>
  <div id="content">Inhalt</div>
  <div id="news">News</div>
  <div id="footer">Fusszeile</div>
 </div>
</body>
</html>


und dieses dann mittels der CSS-Datei die Maße etc. festlege, kommt folgendes Phänomen, das sich bei Firefox (bei IE nicht) trotz 'width: 70%' und 'width: 30%' Angabe zweier <div>-Container, die Container nicht nebeneinander positionieren lassen.

Hier gibts erstmal den CSS-Code:
Code:
#layout{
width: 90%;
margin-left: auto;
margin-right: auto;
}

#header{
font-size: 20px;
border: 2px solid black;
text-align: center;
-moz-text-align: center;
}

#menu{
font-size: 20px;
border: 2px solid black;
text-align: center;
-moz-text-align: center;
}

#content{
float: left;
font-size: 20px;
border: 2px solid black;
width: 70%;
text-align: center;
-moz-text-align: center;
}

#news{
float: right;
width: 30%;
border: 2px solid black;
}

#footer{
clear: both;
font-size: 20px;
border: 2px solid black;
text-align: center;
-moz-text-align: center;
}


uund hier das, was ich versucht habe in worten wieder zu geben:




Hab echt keine Lösung dafür :/
  View user's profile Private Nachricht senden
emorikaner

Dabei seit: 23.06.2009
Ort: -
Alter: -
Geschlecht: Männlich
Verfasst Fr 26.08.2011 15:55
Titel

Antworten mit Zitat Zum Seitenanfang

Zunächst mal, die fehlt ein Doctype vor deinem Quelltext, deswegen wird dein HTML im IE anders gerendert als im FF.

Der IE zählt dann den border mit zum width, was er eigentlich nicht tun sollte.
Der FF macht das richtig, du hast ja insgesamt 100% Breite + 4px border, was ja über die Gesamtbreite hinausgeht, weshalb er dort dann umbricht.
  View user's profile Private Nachricht senden
Anzeige
Anzeige
fyll

Dabei seit: 20.09.2003
Ort: Augsburg
Alter: 39
Geschlecht: Männlich
Verfasst Fr 26.08.2011 15:56
Titel

Antworten mit Zitat Zum Seitenanfang

Und dann sollte dir das weiterhelfen.
  View user's profile Private Nachricht senden
Surras
Threadersteller

Dabei seit: 26.08.2011
Ort: -
Alter: -
Geschlecht: -
Verfasst Fr 26.08.2011 18:45
Titel

Antworten mit Zitat Zum Seitenanfang

aww... ok das hab ich natürlich nicht gewusst Lächel auch das mit dem Doctype nicht^^ naja, bin halt noch Anfänger mit CSS und HTML wurde noch von ganz früher aus Realschulzeiten aus dem Gedächtnis gegraben. Gibt es denn eine Möglichkeit den Rahmen innen anzeigen zu lassen? (so das er entsprechend nicht umbricht und ich dennoch einen Rahmen hab ^^)

Ich möchte nicht mit absouluten werten arbeiten, da das Layout ja flexibel der Auflösung entsprechend sein soll. Lächel
  View user's profile Private Nachricht senden
 
Ähnliche Themen Firefox zeigt <div> versetzt an
Hilfe: div float / width:100% - CSS float Box Model
css bild ist versetzt in IE
header versetzt im IE Hilfe!
[solved]Pop up wird versetzt dargestellt
javascript: warum ist der mauszeiger versetzt?
Neues Thema eröffnen   Neue Antwort erstellen
MGi Foren-Übersicht -> Allgemeines - Nonprint


Du kannst keine Beiträge in dieses Forum schreiben.
Du kannst auf Beiträge in diesem Forum nicht antworten.
Du kannst an Umfragen in diesem Forum nicht mitmachen.