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

html + css. Irgendwie wechselt der text die zeile nicht :(

G

gigu

Neues Mitglied
Hallo zusammen

wenn ich text hinzufüge wechselts mir irgendwie die zeile nicht mehr automatisch, d.h. der gesamte text im div "contents" wird überschrieben, wenn er eigentlich die zeile wechseln sollte. was mache ich nur falsch? ich hab nun ca. 2h gegoogelt und so weiter aber ich finde einfach nichts.

des weiteren wird meine seite nur im internet explorer korrekt angezeigt. in google chrome beispielsweise kommt nichtmal mehr die richtige hintergrundseite.

bitte lacht mich nicht aus, dies ist meine erste seite und komplett nach verschiedenen tutorials, die ich im web gefunden habe zusammengestellt.

für eure hilfe wäre ich sowas von dankbar!!!

liebe grüsse

gigu

meine seite:
<!--Force IE6 into quirks mode with this comment tag-->
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"
"http://www.w3.org/TR/html4/loose.dtd">
<html xmlns="XHTML namespace" lang="en" xml:lang="en">
<style type="text/css">
@import url ("styles.css");
</style>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1" />
<title>bla</title>
</head>
<body>
<div id="container">
<div id="header">
<iframe name="header" align="left" src="header.html" width="1060" height="100" frameborder=0 scrolling="no"></iframe>
</div>

<div id="mainnav">
<iframe name="mainnav" align="left" src="navbox.html" width="900" height="28" frameborder=0 scrolling="no"></iframe>
</div>

<div id="flash">
<iframe name="flashnews" align="left" src="flashnewsbox.html" width="150" height="200" frameborder=0 scrolling="auto"></iframe>
</div>
<div id="kfeedback">
<iframe name="kfeedback" align="left" src="kfeedbackbox.html" width="150" height="200" frameborder=0 scrolling="auto"></iframe>
</div>

<div id="gzahlen">
<iframe name="gzahlen" align="left" src="gzahlenbox.html" width="150" height="200" frameborder=0 scrolling="auto"></iframe>
</div>

<div id="contents">
<br>
<h1>bla</h1>
<h2>bla</h2>
<p>Hallo Guten Tag HAllo Hallo Guten Tag HAllo Hallo Guten Tag HAllo Hallo Guten Tag
HAllo Hallo Guten Tag HAllo Hallo Guten Tag HAllo Hallo Guten Tag HAllo Hallo
Guten Tag HAllo Hallo Guten Tag HAllo Hallo Guten Tag HAllo Hallo Guten Tag
HAllo Hallo Guten Tag HAllo Hallo Guten Tag HAllo Hallo Guten Tag HAllo Hallo
Guten Tag HAllo Hallo Guten Tag HAllo Hallo Guten Tag HAllo Hallo Guten Tag
HAllo Hallo Guten Tag HAllo Hallo Guten Tag HAllo </p>
<br>
<p>Hallo Test. Hallo Test. Hallo Test. Hallo Test. Hallo Test. Hcvcvbcvb cvb cvbcvbc vb cvb cvbcvbcv vbc vbcv bcvb cvballo Test. Hallo Test. Hallo Test. Hallo Test. Hallo Test. Hallo Test. Hallo Test. Hallo Test. Hallo Test. Hallo Test. Hallo Test. Hallo Test. Hallo Test. Hallo Test. Hallo Test. Hallo Test. Hallo Test. Hallo Test. Hallo Test. Hallo Test. </p>
<br>
</div>
</div>
</body>

</html>







mein css:

body
{
margin: 0px auto;
padding: 0px;
width:100%;
height:100%;
}
#conatiner
{
}
#header
{
top: 10px;
left: 20px;
position: absolute;
background-color: #104E8B;
color: #104E8B;
text-align: left;
border: 1px solid black;
height: 100px;
width: 1060px;
}
#mainnav
{
top: 115px;
left: 20px;
position: absolute;
background-color: #FFA500;
color: #FFA500;
text-align: left;
border: 1px solid black;
height: 28px;
width: 900px;
z-index:1;
}
#contents
{
top: 150px;
left: 20px;
position: absolute;
background-color: #F5F5F5;
color: #F5F5F5;
text-indent: 7px;
text-align: left;
border: 1px solid black;
width: 900px;
height: 615px;
overflow:scroll;
max-width: 300px;
}
#flash
{
top: 115px;
left: 930px;
position: absolute;
background-color: #F5F5F5;
color: #F5F5F5;
text-align: left;
border: 1px solid black;
height: 200px;
width: 150px;
}
#kfeedback
{
top: 325px;
left: 930px;
position: absolute;
background-color: #F5F5F5;
color: #F5F5F5;
text-align: left;
border: 1px solid black;
height: 200px;
width: 150px;
}
#gzahlen
{
top: 535px;
left: 930px;
position: absolute;
background-color: #F5F5F5;
color: #F5F5F5;
text-align: left;
border: 1px solid black;
height: 200px;
width: 150px;
}
h1
{
font-family:"Verdana";
font-size:16px;
color:#FFA500;
text-align:left
}
h2
{
font-family:"Verdana";
font-size:14px;
color:#575757;
text-align:left;
}
h3
{
font-family:"Verdana";
font-size:12px;
color:#ffa500;
text-align:left;
}
p
{
font-family:"Verdana";
font-size:11px;
color:#000000;
text-align:left;
line-height: 0px;
}
 
Code: 
[COLOR=#333333]line-height: 0px;
dadurch, dass du die zeilen-höhe auf 0 setzt, wird jede zeile auf der selben höhe angezeigt.[/COLOR]
 
@mist zu langsam :O(

Hallo,

ich lach nicht aber zeilen höhe sollte schon größer 0 sein :O)

p
{
font-family:"Verdana";
font-size:11px;
color:#000000;
text-align:left;
line-height: 0px; /*<-- vielleicht >11 da schrift 11*/
}
Zum Vergrößern anklicken....

und das ist auch komisch, zuerst sagst 900px breit aber am ende sagst maximal 300px breit.
Da macht halt ein vernünftiger browser das 300px breit :O)
#contents
{
top: 150px;
left: 22px;
position: absolute;
background-color: #F5F5F5;
color: #F5F5F5;
text-indent: 7px;
text-align: left;
border: 1px solid black;
width: 900px; /*<- 900 ?*/
height: 615px;
overflow:scroll;
max-width: 300px; /*<- 300 ?*/
}
Zum Vergrößern anklicken....

mehr habe ich jetzt nicht gesehen, ist aber bestimmt noch einiges mehr falsch.

Cheffchen
 
super!! vielen dank euch! die 300px breie habe ich eingestellt, um zu sehen, ob ein textumbruch statt findet :)

ich habe in einem tutorial gelesen, dass in einem CSS mittels text-indent in einem div eingerückt werden kann. dies ist bei mir der fall, aber leider rückt der test nu auf der ersten zeile ein.
 
gigu schrieb:
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"
"http://www.w3.org/TR/html4/loose.dtd">
<html xmlns="XHTML namespace" lang="en" xml:lang="en">
<style type="text/css">
@import url ("styles.css");
</style>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1" />
<title>bla</title>
</head>
Zum Vergrößern anklicken....

Hier kannst du einpaar Sachen der richtigkeit halber korrigieren.
Fangen wir erstmal mit dem lang und xml:lang, die kannst du auch auf "de" stellen.

HTML: 
<html xmlns="XHTML namespace" lang="de" xml:lang="de">

Als nächstes, wird falls du den CSS Code in dein HTML einfügt, kommt das in den Head bereich.

HTML: 
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"
"http://www.w3.org/TR/html4/loose.dtd"> 
<html xmlns="XHTML namespace" lang="en" xml:lang="en">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1" />
<title>bla</title>
<style type="text/css">
@import url ("styles.css");
</style>
</head>

Wie ich sehe, importierst du die "styles.css", das geht besser.


HTML: 
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"
"http://www.w3.org/TR/html4/loose.dtd"> 
<html xmlns="XHTML namespace" lang="en" xml:lang="en">
<head>
 <meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1" />
 <title>bla</title>
 <link type="text/css" href="styles.css" ref="stylesheet" />
 </head>


So ist es besser.

Grüße...
 
Zuletzt bearbeitet von einem Moderator:
Du musst dich einloggen oder registrieren, um hier zu antworten.

Neueste Beiträge

Zurück
Oben