nicht angemeldet
<pre>-formatierten Text linksbündig in einem mittigen "Kasten"
0 0 0 0 0 0 0 0 Lösung
0
<pre>-formatierten Text linksbündig in einem mittigen "Kasten"
Hallo!
Ich habe einen <pre>-formatierten Text. Es kommen nur kurze Zeilen vor, allerdings unterschiedlich lange. Da der <pre>-Block gemessen an der längsten Zeile immernoch schmaler als meine Seite ist, möchte ich ihn in der Mitte positionieren. Leider ist dann die Schrift innerhalb des <pre>-Blocks auch zentriert, die soll aber linksbündig bleiben.
Etwa so soll es aussehen:
---------- Das ist die Breite der ganzen Seite -----------
Hier soll der
<pre>-formatierte Block
linksbündig
in der Mitte
dargestellt werden.
Etwa so bekomme ich es nur hin :-( :
---------- Das ist die Breite der ganzen Seite -----------
Hier soll der
<pre>-formatierte Block
linksbündig
in der Mitte
dargestellt werden.
-
goldfish,
Da der <pre>-Block gemessen an der längsten Zeile immernoch schmaler als meine Seite ist,
Das kannst du nicht wissen. Du weißt weder, wie breit das Browserfenster des Users ist noch seine eingestellte Schriftgröße.
möchte ich ihn in der Mitte positionieren.
Du sagtest doch schon was von „Block“. Wie bei jedem anderen Blockelement sollte es margin:auto tun.
Gunnar
--
„Solang wir noch tanzen können
und richtig echte Tränen flennen,
ist noch alles offen,
ist noch alles drin.“
(Gundermann) -
Hi,
dazu müßtest Du dem Block eine feste Breite geben und könntest ihn dann über margin:auto ausrichten. Für den IE bräuchtest Du natürlich noch text-align im Eltern-Element, welches Du für pre wieder auf left setzen kannst.
freundliche Grüße
Ingo -
hi,
Ich habe einen <pre>-formatierten Text. Es kommen nur kurze Zeilen vor, allerdings unterschiedlich lange. Da der <pre>-Block gemessen an der längsten Zeile immernoch schmaler als meine Seite ist, möchte ich ihn in der Mitte positionieren. Leider ist dann die Schrift innerhalb des <pre>-Blocks auch zentriert, die soll aber linksbündig bleiben.
dann sorge dafür, dass alle zeilen gleich lang sind - nötigenfalls mit angehängten leerzeichen.
gruß,
wahsaga--
"Look, that's why there's rules, understand? So that you _think_ before you break 'em."-
wahsaga,
dann sorge dafür, dass alle zeilen gleich lang sind - nötigenfalls mit angehängten leerzeichen.
Also bitte ...
Gunnar--
„Solang wir noch tanzen können
und richtig echte Tränen flennen,
ist noch alles offen,
ist noch alles drin.“
(Gundermann)-
hi,
dann sorge dafür, dass alle zeilen gleich lang sind - nötigenfalls mit angehängten leerzeichen.
Also bitte ...
bitte was? :-)
nein, bei präformatiert ausgegebenem text macht das m.E. "den kohl auch nicht mehr fett".
ansonsten natürlich width in em angeben (sollte ja gerade bei monospace gut gehen), und über margin:auto zentrieren, wie ihr schon sagtet ...
gruß,
wahsaga--
"Look, that's why there's rules, understand? So that you _think_ before you break 'em."-
wahsaga,
nein, bei präformatiert ausgegebenem text macht das m.E. "den kohl auch nicht mehr fett".
Der H. Kohl ist schon fett.
Mal abgesehen von Uneleganz und Verschwendung von Bandbreite (OK, sind nur’n paar Bytes): Wenn du den Text änderst und die längste Zeile dadurch noch länger wird, musste alle Zeilen nachbearbeiten.
Nee nee, das ist nicht quick and dirty, sondern nicht quick, dafür um so mehr dirty.
Gunnar
--
„Solang wir noch tanzen können
und richtig echte Tränen flennen,
ist noch alles offen,
ist noch alles drin.“
(Gundermann)
-
-
-
-
Hallo,
Etwa so soll es aussehen:
Wenn Du in etwa weißt, wie viele Zeichen maximal möglich sind, dann könnte es ungefähr ;-)) funktionieren.
Bsp:
Maximal 25 Zeichen:<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN"
"http://www.w3.org/TR/html4/strict.dtd">
<html>
<head>
<title>PRE in Mitte</title>
<meta http-equiv="content-type" content="text/html; charset=ISO-8859-1">
<style type="text/css">
<!--
body {font-size:101%;}
pre {font-size:1em; width:25ex; margin:auto;}
-->
</style>
</head>
<body>
<pre>
Hier soll der
<pre>-formatierte Block
linksbündig
in der Mitte
dargestellt werden.
</pre>
</body>
</html>viele Grüße
Axel
-
margin:auto funktioniert anscheinend nicht. Das Problem ist, dass die mittigen Blockelemente sich alle bis zum rechten und linken Rand ausdehnen. Würden sie das nicht tun, wäre alles gut.
-
Hi,
margin:auto funktioniert anscheinend nicht.
im IE grundsätzlich nicht, ja.
Das Problem ist, dass die mittigen Blockelemente sich alle bis zum rechten und linken Rand ausdehnen.
Wenn für sie keine kleinere Breite angegeben ist, natülich.
freundliche Grüße
Ingo-
margin:auto funktioniert anscheinend nicht.
im IE grundsätzlich nicht, ja.Da den ja die meisten Leute benutzen, kann ich das also schlecht einsetzen :-(
Das Problem ist, dass die mittigen Blockelemente sich alle bis zum rechten und linken Rand ausdehnen.
Wenn für sie keine kleinere Breite angegeben ist, natülich.Leider kenne ich die Breite des mittigen Blockelements nicht, um sie setzen zu können :-(
-
Wenn ich die Breite mit width setze und der Inhalt breiter ist, wird das Element ja automatisch entsprechend breiter...
Hab es jetzt also einfach auf 5em gesetzt :-) Overflow hab ich auch sicherheitshalber nochmal explizit auf visible gesetzt.-
goldfish,
Wenn ich die Breite mit width setze und der Inhalt breiter ist, wird das Element ja automatisch entsprechend breiter...
Nein! Das macht der IE so, andere Browser nicht.
Du kannst aber
pre {min-width:5em}
setzen, was der IE nicht versteht, und für den IE die Breite mit width angeben, das aber für andere Browser verstecken:
* html pre {width:5em}
Gunnar
--
„Solang wir noch tanzen können
und richtig echte Tränen flennen,
ist noch alles offen,
ist noch alles drin.“
(Gundermann)-
Hallo,
Du kannst aber
pre {min-width:5em}*g*
Das kann er machen. Allerdings ist das PRE-Element dann wieder so breit, wie der containing block, also im Beispiel BODY. Schließlich heißt es min-width und nicht preferred-width.Mit margin:auto für PRE steht damit alles linksbündig am BODY.
viele Grüße
Axel
-
pre {min-width:5em}
*g*
Das kann er machen. Allerdings ist das PRE-Element dann wieder so breit, wie der containing block, also im Beispiel BODY. Schließlich heißt es min-width und nicht preferred-width.Ähm, ja. Ich meinte natürlich max-width.
Gunnar
--
„Solang wir noch tanzen können
und richtig echte Tränen flennen,
ist noch alles offen,
ist noch alles drin.“
(Gundermann)
-
-
-
-
-
Hallo,
margin:auto funktioniert anscheinend nicht.
im IE grundsätzlich nicht, ja.In meinem (IE6) schon, wenn ich ihn nicht in den Quirks-Mode schicke.
viele Grüße
Axel
-
Also ich hab den IE 6 und ich bilde mir ein da nichts derartiges verstellt zu haben. Bei mir passiert nix.
Quirks-Mode?? *gggg*-
Hallo,
Also ich hab den IE 6 und ich bilde mir ein da nichts derartiges verstellt zu haben. Bei mir passiert nix.
Du hast _exakt_ den Code aus https://forum.selfhtml.org/?t=101017&m=619668 im IE6 ausprobiert, auch den DOCTYPE übernommen?
Quirks-Mode?? *gggg*
http://www.quirksmode.org/css/quirksmode.html
viele Grüße
Axel
-
Also mein IE6 läuft mit meinem Doctype auch nicht im Quirks-Mode. und margin:auto hat nicht zur Folge, dass die mittigen Blöcke nicht mehr bis zum Rand reichen.
Wie auch immer, ich habs ja jetzt anders gelöst ;-). width:5em bewirkt es. Width ist übrigens in dem hier geposteten Code auch drin...-
Hallo,
Also mein IE6 läuft mit meinem Doctype auch nicht im Quirks-Mode. und margin:auto hat nicht zur Folge, dass die mittigen Blöcke nicht mehr bis zum Rand reichen.
Nicht, wenn sie keine Breite angegeben haben. Deshalb schrieb ich ja:
... wenn Du in etwa weißt, wie viele Zeichen maximal möglich sind ...Wie auch immer, ich habs ja jetzt anders gelöst ;-). width:5em bewirkt es.
Nein. Das ist keine Lösung. Die Angabe width:5em bewirkt folgendes:
+----------------------------------------------------------------+
| Hier wird der mittige |
| Text stehen, also nicht |
| in der Mitte. |
| |5em| |Die 5em-Breite steht in der Mitte.
Im IE nicht, der width bei overflow wie eine Art min-width ausführt, aber in allen anderen Browsern schon.
viele Grüße
Axel
-
-
-
-
-
-