Ankündigung

Einklappen
Keine Ankündigung bisher.

[CSS] Firefox zeigt die Seite falsch an [CSS]

Einklappen

Neue Werbung 2019

Einklappen
X
Einklappen
  • Seite von 1
  • Filter
  • Zeit
  • Anzeigen
Alles löschen
neue Beiträge
Vorherige Weiter
  • #1

    [CSS] Firefox zeigt die Seite falsch an [CSS]

    Hallo Leute,

    Hier ist die Seite auf die ich mich beziehe:
    http://www.nano-games.de/test3.htm

    Firefox zeigts falsch an:


    Internet Explorer zeigt es richtig an:


    Code:

    Code:
    <html>
<head>
<title>CSS Test</title>
<style type="text/css">
.item
{
	width: 784px;
	border-width:1px;
	border-color:#999999;
	border-style:solid;
	
	background-color:#D9DEE8;
}

/* Titel Box */
.titleBox
{
	background-color:#CBD2DE;
	border-width:0;
	border-top-width:1px;
	border-left-width:1px;
	border-color:#FFFFFF;
	border-style:solid;
	height:19px;
}

#titleButtons
{
	padding-right:3px;
	text-align:right;
	float:right;
}

#titleText
{
	color:#434343;
	font-family:MS Sans Serif; font-size:12px; font-weight:bold;
	padding-left:7px; padding-top:3px;
	text-align:left;
	float:left;
}

/* Informations Box */
.infBox
{
	border-width:0;
	border-left-width:1px;
	border-top-width:1px;
	border-left-color:#FFFFFF;
	border-top-color:#B4B4B4;
	border-style:solid;
	width:104px;
	float:left;
	background-color:#D9DEE8;
}

/* Informationstext */
.infText
{
	border-width:0;
	border-top-width:1px;
	border-top-color:#F0F0F0;
	border-style:solid;
}

/* Text */
#textBold
{
	color:#434343;
	font-family:MS Sans Serif; font-size:12px; font-weight:bold;
	
	padding-top:4px; padding-left:7px;
}

#textNormal
{
	color:#434343;
	font-family:MS Sans Serif; font-size:12px;
}

#textContent
{
	margin-top:6px;
	margin-left:11px;
	margin-bottom:3px;
}

/* Inhalt */
.contentBox
{
	width:678px;
	float:right;
	border-width:0;
	border-left-width:1px;
	border-top-width:1px;
	border-color:#999999;
	border-style:solid;
	
	background-color:#FFFFFF;
}
</style>
</head>
<body bgcolor="#006699">
<div class="item">
<div class="titleBox">
	<div id="titleButtons">[x]</div>
	<div id="titleText">Hier steht der Titeltext, der kann auch etwas länger sein, je nachdem kann er noch länger sein. Sollte immer gehen.</div>
</div>
<div class="infBox">
	<div class="infText">
		<div id="textBold">Dima</div>
	</div>
</div>
<div class="contentBox">
	<div id="textContent">Text
Text
Text
Text
</div>
</div>
</div>
</body>
</html>
    Kann mit bitte einer helfen? Danke!

    Gruß Dima
    Stichworte: -
  • #2
    meistens ist es der IE der die Seite falsch anzeigt... nur zur Info. Also der Firefox zeigt sie an, wie du sie gemacht hast. Der IE zeigt sie an, wie er denkt dass du es machen wolltest. Damit ist er eine Ausnahme!!

    Kommentar

    • #3
      Zitat von lomtas
      meistens ist es der IE der die Seite falsch anzeigt... nur zur Info. Also der Firefox zeigt sie an, wie du sie gemacht hast. Der IE zeigt sie an, wie er denkt dass du es machen wolltest. Damit ist er eine Ausnahme!!
      und hätte man sich mal kurz die zeit genommen in den code zu schauen, hätte man auch ne antwort geben können, die wirklich hilfreich ist.

      zur frage: du solltest der infbox vielleicht auch ne höhe zuweisen. in deinem fall wohl height:100%, wenn ich das gerade richtig gesehen hab.

      Kommentar

      • #4
        du solltest der infbox vielleicht auch ne höhe zuweisen. in deinem fall wohl height:100%
        Habe ich gemacht: (Firefox)



        In IE hat sich aber nichts geändert!

        Gruß Dima

        Kommentar

        • #5
          height orientiert sich immer am parent, also am div dadrüber. der hat bei dir auch schon keine höhe. also muss er 100% als browserhöhe annehmen.

          Kommentar

          • #6
            Also am besten gleich allen div-Umgebungen ne Höhe zuweisen (und zu Fehlervorbeugung auch gleich body ne Höhe zuweisen [am besten 100%]), sonst stehst du nämlich direkt wieder vor dem selben Problem

            Kommentar

            • #7
              Diese Box ist in der Höhe dynamisch! sprich da können verschiedene Längen von Text rein! Was soll ich machen?

              Gruß Dima

              Kommentar

              • #8
                Gibt einen Trick dazu. Du musst ein Hintergrundbild für das Div machen, was auch den Text enhält. Dieses muss so breit sein wie Text+linke Spalte zusammen. Das machst du ein Pixel hoch und lässte es in y-Richtung wiederholen. Dann die linke Spalte links floaten lassen und du hast den Effekt, dass beide Divs nebeneinander gleich hoch sind. Das ist die einzige mir bekannte Möglichkeit so etwas zu "simulieren".

                Kommentar

                Vorherige Weiter
                Lädt...
                X