nicht angemeldet
Zentrierung einer Spalte.
1 
Gunnar Bittersmann
0 0 Gunnar Bittersmann
0 0 Gunnar Bittersmann
0
Zentrierung einer Spalte.
Hallo liebe Selfhtmler,
ich war früher mal richtig gut in HTML und ich bin nun schon wieder ein paar Jahre raus (habe rein garnix damit gemacht).
Ich möchte das text in einer Spalte des Bildschirmes erscheint. Die Spalte sollte 50% vom Bildschrim breit sein und links und rechts daneben jeweils 25% frei haben. In der Spalte soll text erscheinen.
Momentan habe ich folgendes. Das klappt garnicht.
#content { margin-left: 25%; margin-right: 25%; width: 50%; padding: 0 1em; border: 1px solid black;}
<div id="content">
Hier steht mein Text drink. Dummerweise ragt der über das DIV hinaus, wenn er zu lang ist. :(
</div>
Könnte mir jemand auf die Sprünge helfen?
-
@@Panse:
nuqneH
#content { margin-left: 25%; margin-right: 25%; width: 50%; padding: 0 1em; border: 1px solid black;}
Das Box-Modell [CSS2 §8, SELFHTML]
Bei dir sind 2em + 2px zu viel.
Gib 'margin-left' und 'margin-right' den Wert "auto":
#content { margin: auto; width: 50%; padding: 0 1em; border: 1px solid black; }Qapla'
--
Bildung lässt sich nicht downloaden. (Günther Jauch)-
Super! Das hat geklappt. Allerdings bleibt der Text noch immer nicht in der DIV Box sondern fänt am linken Rand der Div box an und geht dann rechts über edn Rahmen hinaus bis zum rechten Bildschirmrand (wenn der Text lang genug ist).
-
@@Panse:
nuqneH
Allerdings bleibt der Text noch immer nicht in der DIV Box sondern fänt am linken Rand der Div box an und geht dann rechts über edn Rahmen hinaus bis zum rechten Bildschirmrand (wenn der Text lang genug ist).
Nicht bei dem bisher gezeigten Code.
Qapla'
--
Bildung lässt sich nicht downloaden. (Günther Jauch)-
Wo habe ich denn den Fehler gemacht?
-
@@Panse:
nuqneH
Wo habe ich denn den Fehler gemacht?
In dem Teil, den du hier noch nicht gezeigt hast.
Qapla'
--
Bildung lässt sich nicht downloaden. (Günther Jauch)-
Den habe ich doch im Ausgangsposting. Welchen Teil meinst du?
-
@@Panse:
nuqneH
Den habe ich doch im Ausgangsposting. Welchen Teil meinst du?
Ich hatte dir bereits gesagt, dass bei dem von dir im Ausgangsposting gezeigten und auch nach dessen Modifizierung nichts „aus dem Rahmen fällt“.
Wenn das Problem auftritt, verschweigst du beharrlich dessen Ursache.
Wie wär’s denn mal mit dem ganzen Code oder noch besser einem Link zu deiner problematischen Seite?
Qapla'
--
Bildung lässt sich nicht downloaden. (Günther Jauch)-
Also die Seite ist noch nicht online.
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
<title>My Title</title>
<style type='text/css'>
body { background-color: white; }
#content { margin: auto; width: 50%; padding: 0 1em; border: 1px solid black;}
p { white-space: pre }
a { text-decoration: none }
a:hover { text-decoration: underline }
a:active { text-decoration: underline }
strike { color: grey }
u { text-decoration: none;
background-color: yellow }
tt { color: #2e3436; }
pre { color: #2e3436; margin-left: 20px }
</style>
</head>
<body><div id="content">
<h1>noch eine Überschrift</h1>
<h1>noch eine Überschrift</h1>
Hier steht der text der überragt (bis an den rechten Bildschrimrand).
</div>
</body>
</html>-
@@Panse:
nuqneH
Und wieder steht nichts über.
Glaskugel:
Wenn du allerdings „Hier steht der text der überragt (bis an den rechten Bildschrimrand).“ in ein 'p'-Element tust, dann ja. Was aber bei
p { white-space: pre }
nicht verwundern sollte.
Qapla'
--
Bildung lässt sich nicht downloaden. (Günther Jauch)-
Ahhh, danke!
-
-
-
-
-
-
-
-
-