• Das Erstellen neuer Accounts wurde ausgesetzt. Bei berechtigtem Interesse bitte Kontaktaufnahme über die üblichen Wege. Beste Grüße der Admin

Firefox Darstellung

P

Powerslave

New member
Tach,

da ich immer nich genau weiß wo es Schwierigkeiten zwischen dem IE und Mozilla gibt hab ich mir mal ne kleine Testpage gebastelt. Sieht im IE ok aus, jedoch im Firefox wird der mittlere Bereich mit einer vertikalen und einer horizontalen Scrollbar versehen.

Hoffe mir kann jemand sagen wieso, und wie ich es wegbekommen kann :)

HTML: 
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"
    "http://www.w3.org/TR/html4/loose.dtd">
<html> 
<head> 
<title>Dokumenttitel</title> 
<style type="text/css">
 body{
	background-color:#000000;
	font-family:Verdana;
}
 .box{
	float:left;
	height:100%;
}
 .ueberschrift{
	font-size:medium;
	margin-left:12;	
}
 .text{
	font-size:x-small;
	margin-left:12;
	margin-right:12;
	text-align:justify;
}
 #left{
	background-color:#abcdef;
	width:25%;
}
 #right{
	background-color:#abcdef;
	width:25%;
}
 #content{
	background-color:#ffffff;
	width:50%;
	border-top:solid 5px #abcdef;
	border-bottom:solid 5px #abcdef;
	overflow-y:auto;
}
 #rahmen{
	width:100%;
	border:solid 2px black;
}
 #menueheader{
	margin-right:10;
	margin-bottom:0;
}
 #body{
	margin:0 10 10 10;
	border-top:solid 5px #abcdef;
}
</style> 
</head> 
<body> <div id="left" class="box"></div>
<div id="content" class="box">
 <div id="rahmen" class="box">
  <div id="header" style="height:10%; border-bottom:solid 2px black" align=center>
   <br>
   <font color=orange>Z</font>olala <font color=orange>N</font>ülülü - <font color=orange>H</font>ololo
   <br>
  </div>
  <p id="menueheader" align=right>
    News
  </p>
  <div id="body">
   <p class="ueberschrift">
    Dies ist eine super Nachricht<br>
    <font size=1>12.01.2006 23:06 Uhr</font>    
   </p>
   <p class="text">
    Lorem ipsum dolor sit amet, consectetuer adipiscing elit, sed diam nonummy nibh euismod tincidunt ut laoreet dolore magna aliquam erat volutpat. Ut wisi enim ad minim veniam, quis nostrud exerci tation ullamcorper suscipit lobortis nisl ut aliquip ex ea commodo consequat. Duis autem vel eum iriure dolor in hendrerit in vulputate velit esse molestie consequat, vel illum dolore eu feugiat nulla facilisis at vero eros et accumsan et iusto odio dignissim qui blandit praesent luptatum zzril delenit
   </p>
   <p class="ueberschrift">
    Woooowww...<br>
    <font size=1>12.01.2006 23:04 Uhr</font>    
   </p>
   <p class="text">
    augue duis dolore te feugait nulla facilisi.Lorem ipsum dolor sit amet, consectetuer adipiscing elit, sed diam nonummy nibh euismod tincidunt ut laoreet dolore magna aliquam erat volutpat. Ut wisi enim ad minim veniam, quis nostrud exerci tation ullamcorper suscipit lobortis nisl ut aliquip ex ea commodo consequat. Duis autem vel eum iriure dolor in hendrerit in vulputate velit esse molestie consequat, vel illum dolore eu feugiat nulla facilisis at vero eros et accumsan et iusto odio dignissim qu
   </p>
  </div>
 </div>
</div>
<div id="right" class="box"></div> </body> 
</html>
 
Zuletzt bearbeitet:
also ich hatte keine lust mir diesen unübersichtlichen quelltext anzugucken ...
wenn du es noch nich hast: versehe die css tags der bereiche in denen die ungewünschten scrollbalken sind mit:
overflow: hidden;
gruß noise
 
Ok, habs geändert, siehe ersten Beitrag. Hoffe jetz is es besser lesbar.

overflow:hidden funktioniert so nicht, denn dann wird einfach der überstehende teil abgeschnitten
 
1. oh tschuldige
2. sehe ich das richtig, dass der mittlere bereich #content ist ?!?
-> etwas genauere angaben wären hilfreich
 
Zuletzt bearbeitet:
Ja gut, selbst wenn ichs rausnehm wird ein kleines Stück einfach abgeschnitten, irgendwas mit den werten passt noch nich anscheinend... kann sichs nich jemand mal anschaun?
 
Wo denn?

Wenn ich das Beispiel von dir nehme und überall Einheiten einbaue und die ungültige Eigenschaft rausnehme, wird nichts abgeschnitten.
 
Ich hab das ganze mal umgebaut, da dass ganze auch eine DIV Suppe war.
HTML: 
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01//EN"
      "http://www.w3.org/TR/html4/strict.dtd">
<html> 
<head> 
<title>Dokumenttitel</title> 
<style type="text/css"> 
 body{ background-color:#000000; font-family:Verdana; }
#content
{
    background-color:#000; 
    width:50%; 
    border-top:solid 5px  #abcdef; 
    border-bottom:solid 5px #abcdef;  
    padding: 2px 0 2px 2px;
}
#content div
{
    background-color:#fff; 
    padding: 0px;
    margin:0;
}

#content h1, #content h2, #content h3, #content p
{
    font-size:1em;
    font-weight:normal;
    margin:0;
    padding:0;
}
#content h2, #content h3, #content p
{
    margin-left:20px;
}
#content h1
{
    text-align:center; 
    border-bottom:2px solid black;
    padding-top:1em;
}
#content h1 span
{
    color:orange;
}

#content h2
{
    text-align:right;
    padding-top:1em;
    border-bottom:solid 5px #abcdef;  
    margin-bottom:2em;
    margin-right:10px;
}
#content h3 
{
}
#content h3 small
{
    font-size:0.7em;
}
#content p
{
    padding:1em 1em 1em 0;
    font-size:x-small;
    
}
</style> 
</head> 
<body> 

<div id="content">
<div>
<h1> <span>Z</span>olala <span>N</span>ülülü - <span>H</span>ololo</h1>
<h2> News </h2>
<h3>
  Dies ist eine super Nachricht<br>
  <small>12.01.2006 23:06 Uhr</small>
</h3>
<p>  
Lorem ipsum dolor sit amet, consectetuer adipiscing elit, sed diam nonummy nibh 
euismod tincidunt ut laoreet dolore magna aliquam erat volutpat. 
Ut wisi enim ad minim veniam, quis nostrud exerci tation ullamcorper suscipit lobortis nisl ut aliquip ex ea commodo 
consequat. Duis autem vel eum iriure dolor in hendrerit in vulputate velit esse molestie consequat, vel illum dolore 
eu feugiat nulla facilisis at vero eros et accumsan et iusto odio dignissim qui blandit praesent luptatum 
zzril delenit </p>  
<h3>  Woooowww...
<br>  
<small>12.01.2006 23:04 Uhr</small>
</h3>  
<p>  
augue duis dolore te feugait nulla facilisi.Lorem ipsum dolor sit amet, consectetuer adipiscing elit, sed 
diam nonummy nibh euismod tincidunt ut laoreet dolore magna aliquam erat volutpat. 
Ut wisi enim ad minim veniam, quis nostrud exerci tation ullamcorper suscipit lobortis nisl ut aliquip ex ea 
commodo consequat. Duis autem vel eum iriure dolor in hendrerit in vulputate velit esse molestie consequat, vel 
illum dolore eu feugiat nulla facilisis at vero eros et accumsan et iusto odio dignissim qu 
</p>
</div></div>

   </body> </html>
 
Du musst dich einloggen oder registrieren, um hier zu antworten.
Zurück
Oben