Hallo,
ich komme an einem Punkt nicht weiter.
Ich hoffe Ihr könnt mir behilflich sein.
Ich möchte unter einem Textblock ein Wort und in einem anderen Fall ein Strich anordnen. Problem, der Textblock ist im Firefox durch die Schriftanpassung länger und deshalb passt die Positionieung des Strichs oder Wort nicht mehr.
So mache ich es bisher.
.
.
.
.
.
<div class="text">
hier steht ein etwas längerer Text. Ca 20 Zeilen lang.
<br>
<br>
<div class="weiterlesen"/><a href="textzwei.html">weiterlesen </a>
</div>
</div>
Erklärung:
Erst kommt der Text, (align: justify) den ich mit Hilfe von CSS definiere und anordne.
Dann soll das Wort "Weiterlesen" etwas unterhalb des Textes positioniert werden und etwas entfernt vom rechten Rand. (Habe den vorherigen Text als Block definiert)
Ob ich jetzt anstelle des Wortes "Weiterlesen", eine Grafik (Strich) platziere, wird wohl von der Umsetzung her gleich sein.
Kann mir jemand sagen, was ich nicht beachtet habe?
fragt
Markus
hier noch die CSS codes
CSS
.text {
position: absolute;
left: 157px;
top: 395px;
font-family:Times, Arial, Helvetica, Verdana, Times;
font-size:12px;
font-weight: 100;
line-height:1.4em;
letter-spacing: 0.03em;
text-transform:none;
color: black;
z-index:65;
text-align:justify;
display:block;
width:335px;
}
.weiterlesen{
position: relative;
left: 0px;
top: 0px;
z-index:75;
font-family:Arial, Helvetica, Verdana, Times;
font-size:10px;
font-weight: 800;
line-height:1.4em;
letter-spacing: 0.04em;
text-transform:none;
color: dimgray;
text-align:right;
display:block;
width:335px;
}
Problemmit Wortpositionierung an bestimmter Stelle unter einem Text
-
-
Innenabstände erreichst du mit padding:
Code
Alles anzeigen.weiterlesen{ font-family:Arial, Helvetica, Verdana, Times; font-size:10px; font-weight: 800; line-height:1.4em; letter-spacing: 0.04em; color: dimgray; text-align:right; width:300px; padding-right: 35px; padding-top: 10px; }
Achte darauf, dass die Summe von width und padding-right/left den übergeordneten 335px entspricht.
-
Hey Sejuma,
funktioniert spitzenmäßig!
Herzlichen Dank für die schnelle Antwort!
Frohes Fest und guten Rutsch!
LG Markus -
Zitat
<div class="weiterlesen"/>ist übrigens auch falsch, div ist ein container, es macht überhaupt kein Sinn den leerzulassen. Ich nehm einfach mal an du hast dich vertippt und dein Browser verbessert es
Zitat
<div class="weiterlesen">So müsste es aussehen.