Um schreiben oder kommentieren zu können, benötigen Sie ein Benutzerkonto.
Sie haben schon ein Benutzerkonto? Melden Sie sich hier an.
Jetzt anmeldenHier können Sie ein neues Benutzerkonto erstellen.
Neues Benutzerkonto erstellen
Hallo!
Wenn du gerade an deiner Website arbeitest oder dein aktuelles Hosting überdenkst: Wir betreiben mit NetzLiving eine Hosting-Plattform, die speziell auf Performance, Sicherheit und einfache Verwaltung ausgelegt ist.
Sieht nach line-height aus. Alternativ an padding- und margin-Werten über 0.
Sieht nach line-height aus. Alternativ an padding- und margin-Werten über 0.
Vielen Dank. Der Line-Height-Code war gefragt.
Eine weitere Frage: Wie hoch ist der gängige Wert, der eine saubere Darstellung anzeigt? 1,5 erscheint mir zu eng, 2,0 ist zu weit. Welchen Wert würdest Du empfehlen? Die Schrift ist elf Pixel groß.
Du sagst es quasi schon selbst. :) Es ist abhängig von der Schriftgröße bzw. dem -maß, also px, em oder pt. Kleine Hilfe: Ist der Wert von line-height kleiner als die aktuelle Schriftgröße (font-size), so überlagern sich die Zeilen. Du kannst übrigens auch neben Nummernwerten "normal" eingeben, das ist der Initialwert. ;)
text-align müsste es heißen, nicht align
text-align müsste es heißen, nicht align
Ach, stimmt ja. Danke. Die Kombination funktioniert jetzt ohne Fehler. Nun müsste ich nur noch wissen, wie ich einen neuen Absatz erstelle.
Wenn ich jeden einzelnen Absatz mit einem p-Tag umschließe, erscheint der Absatzabstand zu klein, siehe Bildausschnitt.
<p><div style="text-align: justify; line-height: 1,7;">Absatz 1: Text.</div></p>
<p><div style="text-align: justify; line-height: 1,7;">Absatz 2: Text.</div></p>Ohne p-Tags im zweiten Absatz erscheint die Darstellung natürlich im Fließtext, siehe Bildausschnitt.
Wie lautet der Code, um den Absatzabstand zu vergrößern?
<p><div style="text-align: justify; line-height: 1,7;">Absatz 1: Text.</div></p>
kannst du auch mit
<p style="text-align: justify; line-height: 1,7;">Absatz 1: Text.</p>
ersetzen.
Um den Abstand der Absätze zu vergößern, einfach mit margin und/oder padding arbeiten.
PHP<p><div style="text-align: justify; line-height: 1,7;">Absatz 1: Text.</div></p>kannst du auch mit
PHP<p style="text-align: justify; line-height: 1,7;">Absatz 1: Text.</p>ersetzen.
Um den Abstand der Absätze zu vergößern, einfach mit margin und/oder padding arbeiten.
Vielen Dank!
Auch möchte ich gerne wissen, wie ich die Codes so ins Stylesheet übernehme, dass nach dem Veröffentlichen eines Eintrages der Text in der eben gewünschten Darstellung erscheint.
{
margin: 0em;
padding: 0em;
}
a:link,a:visited
{
color: #000000;
text-decoration: none;
}
a:hover,a:active
{
color:#000000;
text-decoration:underline;
}
h1,h2,h3,h4,h5,h6
{
color:#330;
font-family:Georgia,Verdana,Arial, Serif;
letter-spacing:1px;
}
img
{
border:#000000 0px solid;
padding:2px;
}
img.left
{
float:left;
margin:0 1em 1em 0;
}
img.right
{
float:right;
margin:0 0em 1em 1em;
}
blockquote {
margin:1em;
padding:1em;
border-left:#999 1px dashed;
color:#000000;
}
.clear
{
clear:both;
}
fieldset
{
border:0;
}
#main ol,#main ul
{
margin:1em;
padding:0 2em;
}
#main ul.asides
{
margin:0 0 2em 0;
padding:1em;
list-style-type:square;
border-bottom:#eec 1px solid;
}
body
{
background: #eee url(img/tile.gif);
color: #333;
font-size:10px;
font-family: Verdana,Tahoma, Arial, Serif;
font-size: small;
font-size:0.76em;
}
#outer
{
width: 75%;
margin: 0 auto 2em auto;
padding: 0;
border: #ccc 1px solid;
background:#fff;
}
#menu
{
font-family:Tahoma, Verdana, Arial, Serif;
padding: 1em 0.5em;
width: 75%;
margin: 1em auto 0;
text-align:right;
}
#menu a
{
color:#300;
text-decoration: none;
padding:0.8em 0.5em;
}
#menu ul
{
list-style: none;
padding: 0em;
}
#menu li
{
display: inline;
font-size: 1em;
font-weight: bold;
}
#menu li a:hover,#menu li a:active,#menu li.current_page_item a
{
border-bottom: #bc0000 2px solid;
}
#header
{
margin:0;
padding:2em;
}
#header h1
{
font-size: 2.4em;
font-weight: normal;
letter-spacing: 1px;
}
#header h1 a
{
color:#300;
}
#header h2
{
position: relative;
font-size: 0.9em;
font-weight:normal;
border-style:none;
}
#header #searchform
{
float:right;
margin:0;
padding:0;
}
#feedinfo
{
padding:0.5em 2em;
background:#f9f7f5;
border-top:#eee 1px solid;
border-bottom:#eee 1px solid;
font-size:0.9em;
margin: 0;
}
#feedinfo em
{
float:right;
font-style:normal;
}
#feedinfo .feed
{
background:url(img/icon_feed.gif) no-repeat left center;
padding:4px;
padding-left:17px;
}
#content
{
margin-top: 1.0em;
padding: 1.2em;
line-height: 2.2em;
position: relative;
clear:both;
}
#main
{
width: 70%;
float: right;
position: relative;
margin:0;
padding:0 2% 1%;
}
#main p
{
line-height:1.6em;
margin-top: 0;
margin-bottom: 0.5em;
}
#main .post
{
margin:0 0 3em 0;
}
#main h2
{
font-size: 1.7em;
font-weight:normal;
}
#main h2.pagetitle
{
font-size: 1.5em;
font-weight:normal;
border-bottom:none;
margin:0 0 1em 0;
}
#main h2 a
{
color: #300;
}
#main .post-content
{
margin:1em 0;
padding:0;
}
#main .post-content ul, #main .post-content ol
{
margin:1em 2em;
padding:0;
}
#main p.post-info
{
clear:both;
padding:3px 0;
margin:1em 0;
color:#999;
font-size:0.9em;
border-bottom: solid 1px #999;
}
#main p.post-info a
{
color:#999;
}
#comments, #respond{
margin: 2em 0 10px 5px;
font-size:1.4em;
font-weight:normal;
}
#commentform
{
margin:10px 0;
padding:10px;
background:#f9f7f5;
border-top: #ccc 1px solid;
border-bottom: #ccc 1px solid;
}
.commentnum
{
font-size:1.5em;
font-weight:bold;
padding:3px;
}
#outer .commentlist {
margin: 0;
padding: 0;
border-top: #ccc 1px solid;
list-style:none;
}
.commentlist li
{
list-style:none;
margin: 0;
padding:1em;
border-bottom: #ccc 1px solid;
}
.commentlist li.alt
{
background:#f9f7f5;
}
.commentlist li .cmtinfo
{
font-size:1em;
}
.commentlist li cite
{
font-style:normal;
font-weight:bold;
}
.commentlist li .cmtinfo em
{
float:right;
margin:0;
padding:0;
font-style:normal;
font-size:0.9em;
color:#999;
}
#outer .nocomments
{
text-align:center;
color:#999;
font-size:0.9em;
}
input.textbox
{
border:#ccc 1px solid;
background:#f9f9f9;
font:1em Verdana, Arial, Serif;
padding:2px;
width:150px;
}
textarea{
width: 90%;
padding:5px;
height: 20em;
border: 1px solid #ccc;
background:#f9f9f9;
font:1em Verdana, Arial, Serif;
}
.textbox:focus, textarea:focus
{
background:#fff;
border:#999 1px solid;
}
#sidebar
{
width: 22%;
float: left;
position: relative;
font-size: 0.9em;
margin:0;
padding:0 2%;
}
#sidebar p
{
margin-bottom: 2.0em;
color: #4F4F2B;
}
#sidebar h2
{
border-bottom:#999 1px solid;
font-size: 1.6em;
margin-bottom: 1em;
padding:0;
font-weight:normal;
}
#sidebar ul
{
list-style: none;
line-height: 2.0em;
margin-bottom: 2em;
}
#sidebar form
{
margin-bottom:2em;
}
#sidebar input.textbox
{
width:80%;
}
#sidebar ul ul ul
{
list-style: none;
line-height: 2.0em;
margin:0;
padding:0 1em;
}
#footer
{
padding:0 0 1em 0;
margin:0 auto;
font-size: 0.9em;
clear: both;
text-align:center;
line-height:1.6em;
width:75%;
}Zitat von AlphawolfUm den Abstand der Absätze zu vergößern, einfach mit margin und/oder padding arbeiten.
Das scheint auch nicht optimal zu funktionieren, siehe Bildausschnitt. Der neue Absatz wird eingezogen. Liegt das am Stylesheet?
<p style="text-align: justify; line-height: 1,7; padding (oder margin): 20px">Text</p>Links und rechts darf natürlich kein Padding/Margin sein, sonst gibt's natürlich einen Einzug. ;)
Also:
<p style="text-align: justify; line-height: 1,7; padding (oder margin): 20px [COLOR="SeaGreen"]0px;[/COLOR]">Text</p>Übrigens: 1.7 und nicht 1,7. Und Was 1.7? Ostereier? Also entweder % oder em. ;-)
Zitat von marXÜbrigens: 1.7 und nicht 1,7. Und Was 1.7? Ostereier? Also entweder % oder em. :wink:
Danke für den Hinweis.
Links und rechts darf natürlich kein Padding/Margin sein, sonst gibt's natürlich einen Einzug. ;)
Also:
Code<p style="text-align: justify; line-height: 1,7; padding (oder margin): 20px [COLOR=SeaGreen]0px;[/COLOR]">Text</p>
Hat natürlich wie immer geklappt. Danke!
Jetzt müsste ich nur noch wissen, an welcher Stelle des Stylesheets ich die Codes einfüge, damit die gesamte Darstellung (Fließtext- und Absatzabstände) automatisch übernommen wird, wenn ich einen Eintrag veröffentliche. Kann mir da jemand weiterhelfen? Ich möchte keine Fehler im Sheet verursachen.
{
margin: 0em;
padding: 0em;
}
a:link,a:visited
{
color: #000000;
text-decoration: none;
}
a:hover,a:active
{
color:#000000;
text-decoration:underline;
}
h1,h2,h3,h4,h5,h6
{
color:#330;
font-family:Georgia,Verdana,Arial, Serif;
letter-spacing:1px;
}
img
{
border:#000000 0px solid;
padding:2px;
}
img.left
{
float:left;
margin:0 1em 1em 0;
}
img.right
{
float:right;
margin:0 0em 1em 1em;
}
blockquote {
margin:1em;
padding:1em;
border-left:#999 1px dashed;
color:#000000;
}
.clear
{
clear:both;
}
fieldset
{
border:0;
}
#main ol,#main ul
{
margin:1em;
padding:0 2em;
}
#main ul.asides
{
margin:0 0 2em 0;
padding:1em;
list-style-type:square;
border-bottom:#eec 1px solid;
}
body
{
background: #eee url(img/tile.gif);
color: #333;
font-size:10px;
font-family: Verdana,Tahoma, Arial, Serif;
font-size: small;
font-size:0.76em;
}
#outer
{
width: 75%;
margin: 0 auto 2em auto;
padding: 0;
border: #ccc 1px solid;
background:#fff;
}
#menu
{
font-family:Tahoma, Verdana, Arial, Serif;
padding: 1em 0.5em;
width: 75%;
margin: 1em auto 0;
text-align:right;
}
#menu a
{
color:#300;
text-decoration: none;
padding:0.8em 0.5em;
}
#menu ul
{
list-style: none;
padding: 0em;
}
#menu li
{
display: inline;
font-size: 1em;
font-weight: bold;
}
#menu li a:hover,#menu li a:active,#menu li.current_page_item a
{
border-bottom: #bc0000 2px solid;
}
#header
{
margin:0;
padding:2em;
}
#header h1
{
font-size: 2.4em;
font-weight: normal;
letter-spacing: 1px;
}
#header h1 a
{
color:#300;
}
#header h2
{
position: relative;
font-size: 0.9em;
font-weight:normal;
border-style:none;
}
#header #searchform
{
float:right;
margin:0;
padding:0;
}
#feedinfo
{
padding:0.5em 2em;
background:#f9f7f5;
border-top:#eee 1px solid;
border-bottom:#eee 1px solid;
font-size:0.9em;
margin: 0;
}
#feedinfo em
{
float:right;
font-style:normal;
}
#feedinfo .feed
{
background:url(img/icon_feed.gif) no-repeat left center;
padding:4px;
padding-left:17px;
}
#content
{
margin-top: 1.0em;
padding: 1.2em;
line-height: 2.2em;
position: relative;
clear:both;
}
#main
{
width: 70%;
float: right;
position: relative;
margin:0;
padding:0 2% 1%;
}
#main p
{
line-height:1.6em;
margin-top: 0;
margin-bottom: 0.5em;
}
#main .post
{
margin:0 0 3em 0;
}
#main h2
{
font-size: 1.7em;
font-weight:normal;
}
#main h2.pagetitle
{
font-size: 1.5em;
font-weight:normal;
border-bottom:none;
margin:0 0 1em 0;
}
#main h2 a
{
color: #300;
}
#main .post-content
{
margin:1em 0;
padding:0;
}
#main .post-content ul, #main .post-content ol
{
margin:1em 2em;
padding:0;
}
#main p.post-info
{
clear:both;
padding:3px 0;
margin:1em 0;
color:#999;
font-size:0.9em;
border-bottom: solid 1px #999;
}
#main p.post-info a
{
color:#999;
}
#comments, #respond{
margin: 2em 0 10px 5px;
font-size:1.4em;
font-weight:normal;
}
#commentform
{
margin:10px 0;
padding:10px;
background:#f9f7f5;
border-top: #ccc 1px solid;
border-bottom: #ccc 1px solid;
}
.commentnum
{
font-size:1.5em;
font-weight:bold;
padding:3px;
}
#outer .commentlist {
margin: 0;
padding: 0;
border-top: #ccc 1px solid;
list-style:none;
}
.commentlist li
{
list-style:none;
margin: 0;
padding:1em;
border-bottom: #ccc 1px solid;
}
.commentlist li.alt
{
background:#f9f7f5;
}
.commentlist li .cmtinfo
{
font-size:1em;
}
.commentlist li cite
{
font-style:normal;
font-weight:bold;
}
.commentlist li .cmtinfo em
{
float:right;
margin:0;
padding:0;
font-style:normal;
font-size:0.9em;
color:#999;
}
#outer .nocomments
{
text-align:center;
color:#999;
font-size:0.9em;
}
input.textbox
{
border:#ccc 1px solid;
background:#f9f9f9;
font:1em Verdana, Arial, Serif;
padding:2px;
width:150px;
}
textarea{
width: 90%;
padding:5px;
height: 20em;
border: 1px solid #ccc;
background:#f9f9f9;
font:1em Verdana, Arial, Serif;
}
.textbox:focus, textarea:focus
{
background:#fff;
border:#999 1px solid;
}
#sidebar
{
width: 22%;
float: left;
position: relative;
font-size: 0.9em;
margin:0;
padding:0 2%;
}
#sidebar p
{
margin-bottom: 2.0em;
color: #4F4F2B;
}
#sidebar h2
{
border-bottom:#999 1px solid;
font-size: 1.6em;
margin-bottom: 1em;
padding:0;
font-weight:normal;
}
#sidebar ul
{
list-style: none;
line-height: 2.0em;
margin-bottom: 2em;
}
#sidebar form
{
margin-bottom:2em;
}
#sidebar input.textbox
{
width:80%;
}
#sidebar ul ul ul
{
list-style: none;
line-height: 2.0em;
margin:0;
padding:0 1em;
}
#footer
{
padding:0 0 1em 0;
margin:0 auto;
font-size: 0.9em;
clear: both;
text-align:center;
line-height:1.6em;
width:75%;
}Dazu bräuchte man einen Link zu einem Beitrag, damit man sieht, wie der Beitragstext "eingebettet" wird.
Dazu bräuchte man einen Link zu einem Beitrag, damit man sieht, wie der Beitragstext "eingebettet" wird.
Genügt denn nicht auch ein Bildausschnitt? Hier klicken.
<p style="text-align: justify; line-height: 1,7em;">Absatz 1</p>
<p style="text-align: justify; line-height: 1,7em; padding: 8px 0px">Absatz 2</p>
<p style="text-align: justify; line-height: 1,7em; padding: 8px 0px">Absatz 3</p>
<p style="text-align: justify; line-height: 1,7em; padding: 8px 0px">Absatz 4</p>
<p style="text-align: justify; line-height: 1,7em; padding: 8px 0px">Absatz 5</p>Naja, ich brauche Code, um mögliche Klassen/IDs auszumachen, durch die man sich zur Beitragstextauszeichnung durchhangeln könnte, um sie in der style.css zu notieren. Kannst mir den Link auch per PN schicken, wenn du nicht öffentlich posten willst.
Naja, ich brauche Code, um mögliche Klassen/IDs auszumachen, durch die man sich zur Beitragstextauszeichnung durchhangeln könnte, um sie in der style.css zu notieren. Kannst mir den Link auch per PN schicken, wenn du nicht öffentlich posten willst.
Du hast eine PN.
Sie haben noch kein Benutzerkonto auf unserer Seite? Registrieren Sie sich kostenlos und nehmen Sie an unserer Community teil!