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

div vernünftig begrenzen

T

tingelting

Neues Mitglied
Hello ihr Lieben,

für euch ist es mir Sicherheit eine Kleinigkeit, aber ich krieg einfach nicht selbst raus, wie es geht - sind meine ersten Gehversuche.

Ich habe folgendes Problem:
Eine simple Website, 780px breit, zentriert. Soweit so gut. ABER: Wenn ich Text in meinem Contentbereich markiere, geht die Markierung über den ganzen Monitor.

so:
l_9885734a52ca42879fdf9868e8c21b18.jpg


Der Content-Bereich geht eigentlich nur bis zum Ende des weiß. Das dunkle Braun ist Hintergrund.
Ich dachte, ich müsste einfach noch einen div um alles packen, aber das tut's nicht.

Vielen Dank schon mal für eure Hilfe!
 
Ok, hier einmal der Code:

HTML: 
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<meta name="author" content="#" />
<title>website</title>
<link rel="stylesheet" type="text/css" href="css/style.css"/>
<link rel="shortcut icon" type="image/x-icon" href="/favicon.ico">
<style type="text/css">
<!--
.Stil1 {
	color: #666600
}
-->
</style>

</head>
<body>

<div>
<div id="container">

<div id="header">
  <a href="index.html" class="Stil1">
  <br/>
  <br/>
  <br/>
  <br/>
  </a>
</div>


<div id="menu">
	<a href="#">HOME</a> &nbsp;  &nbsp; &nbsp; &nbsp; &nbsp; <a href="#">LUPIT</a></div>

		<div id="sidebar">
		<h1>NEWS.</h1>
		<p><b>18.05.2010</b><br/>und so weiter.</p>
		</div>

		<div id="main">
        <p><b>18.05.2010</b></p>
		<img src="#.jpg" align="left" alt="hello." >
	</div>

		<div id="footer">
		&copy;2010 Zum Beispiel &nbsp;<span class="separator">|</span>&nbsp; Design by <a href="#" title="Design">#</a></div>
</div>
</div>

</body>
</html>

Ich habe ja nun schon einen div um alles gelegt, aber wahrscheinlich muss ich den über CSS definieren, oder? Die Frage ist wie genau... Danke schon mal.
 
Die Seite hat keinen erkennbaren DOCTYPE (DOCTYPE-Switch und seine Auswirkungen).

Code: 
<link rel="shortcut icon" type="image/x-icon" href="/favicon.ico">
Code: 
<img src="#.jpg" align="left" alt="hello." >

An diesen Stellen fehlen unter Umständen die Slahes für "Tag-Ende-Markierungen": "< ... />".

Das beschriebene Problem ist im gezeigten Beispiel nicht auszumachen.
 
@mermshaus: Danke für deine Antwort. Mit den Slashes hast du Recht.

Woher kann denn mein Problem rühren, wenn hier erstmal "alles richtig" ist?

vielleicht liegt es an der div id des containers (CSS)?

HTML: 
#container {
	width: 780px;
	margin: 0 auto;
	background: #FFFFFF;
	border: 1px solid #b2ca42;
	border-bottom: inherit;
}
 
Vielleicht zeigst du ein Beispiel (= eine Kombination aus HTML- und CSS-Code und eventuell Angabe des eingesetzten Browsers), in dem das Problem auszumachen ist. ;) So lässt sich da wenig zu sagen.
 
Machst du die Umbrücheim Text <br>s ?
Denn es scheint so, als hätte das Div, das den text beinhaltet, eine Breite größer dem Bereich in dem der Text steht.

Bsp
Code: 
<div style="width:400px">
Hier steht ganz viel Text, meinetwegen fast 400 Pixel breit<br />
wobei der Zeilenumbruch mittendrin passiert.
</div>

Wenn du also das Div markierst (ich nehme an, du ziehst deine Markeriung über die ganze Seite und nicht nur über den Text) markierst du eben auch die leeren Stellen im Div. Pass das Div also in der Breite an und lass den Text ohne <br>s laufen. Dann sollte es passen.
 
THE_fan schrieb:
Wenn du also das Div markierst (ich nehme an, du ziehst deine Markeriung über die ganze Seite und nicht nur über den Text) markierst du eben auch die leeren Stellen im Div.
Zum Vergrößern anklicken....

Sorry, aber hast du das mal ausprobiert? Textmarkierungen funktionieren nicht so.

HTML: 
<!DOCTYPE html>

<html>

    <head>
        <meta http-equiv="Content-Type" content="text/html; charset=UTF-8" />
        <title>New</title>
    </head>

    <body>
        <div style="width:700px; background: #ccc;">
Hier steht ganz viel Text, meinetwegen fast 400 Pixel breit<br />
wobei der Zeilenumbruch mittendrin passiert.
</div>

    </body>

</html>
 
Hätte ich es nicht auch schon beobachtet, hätte ich den "Tipp" nicht gegeben.
Irgendwo muss es ja herkommen, es werden ja nicht willkürlich irgendwelche leeren Stellen markiert.

Kann ja sein, dass es am Browser liegt / lag. Wer weiß das schon.
 
So... ich habe das Problem gelöst indem ich im CSS meinem Container eine Position zugewiesen habe:
HTML: 
	position: relative;

Jetzt wird nur noch der Text bis zur Grenze des div markiert.

Zu den Umbrüchen: Ich nutze die nicht, damit mein Text irgendwann aufhört weiter zu laufen ,sondern als wirklichen Umbruch. Also als Absatz ohne Leerzeile. Das funktioniert super. Ich habe ja einen "Haupt-div" (Container), der meine ganze Site begrenzt und dann darin einen div, in den ich z.b. Text schreiben kann. Dieser ist ebenfalls über CSS begrenzt.
 
Du musst dich einloggen oder registrieren, um hier zu antworten.

Neueste Beiträge

Zurück
Oben