6 svar · 246 visningar · startad av svamp
Hur får jag en div class som innehåller lite textformatering att alltid hamna längst ner i en annan div id? Jag vill ha det så för att länkar för att läsa hela artikeln i ett artikelregister alltid skall hamna längst ner i den ruta där artikeln förhandsvisas.
Några idéer?
/* svamp */
Fattar inte... :)
Visa lite befintlig kod, kanske en länk till sidan.
Det är som Jesper T säger lite svårt att förstå vad du menar ;)
mv icaaq
/* Detta är ramen för varje inlägg i artikelregistret,
i denna ram finns några css classer för att fixa utseende på
headings och länkar osv....
*/
.contentleft
{
float:left;
width:325px;
height:325px;
background-color: #fff;
border: 1px dashed #f30;
padding:5px;
margin:5px;
text-align:left;
}
/* nedan är titeln för varje artikel... */
.heading
{
width:50%;
border-bottom:2px dashed #999;
margin-top:-5px;
float:left;
text-align:left;
font-weight:bold;
text-decoration:none;
}
/* Nedan är css'en som jag vill alltid skall hamna längst ner till höger....
*/
.articlelink
{
width:50%;
border:none;
float:right;
text-align:right;
font-weight:bold;
font-size:10px;
text-decoration:underline;
}
html/php kod...
...
<div class="contentleft">
<div class="heading"> 3. Bluppo...</div>
Bla bla bla bla bla bla bla bla bla bla bla bla bla
Bla bla bla bla bla bla bla bla bla bla bla bla bla
Bla bla bla bla bla bla bla bla bla bla bla bla bla
Bla bla bla bla bla bla bla bla bla bla bla bla bla
Bla bla bla bla bla bla bla bla bla bla bla bla bla
Bla bla bla bla bla bla bla bla bla bla bla bla bla
Bla bla bla bla bla bla bla bla bla bla bla bla bla
Bla bla bla bla bla bla bla bla bla bla bla bla bla
Bla bla bla bla bla bla bla bla bla bla bla bla bla
Bla bla bla bla bla bla bla bla bla bla bla bla bla
Bla bla bla bla bla bla bla bla bla bla bla bla bla
Bla bla bla bla bla bla bla bla bla bla bla bla bla
Bla bla bla bla bla bla bla bla bla bla bla bla bla
Bla bla bla bla bla bla bla bla bla bla bla bla bla
Bla bla bla bla bla bla bla bla bla bla bla bla bla
<div class="articlelink"><a href="articles/article.php"> Read More -> </a></div>
</div>
...
Jag vill alltså att länken till den fulla artikeln som är längst ner i div classen "contentleft" alltid skall hamna längst ner till höger i varje "contentleft" oavsett hur lång förhandsgranskningen av artikeln är.
Jag provade att sätta position:relative;bottom:0px;right:0px; för classen "articlelink" men det gjorde inte vad jag önskade direkt.
Tyvärr finns inte hela siten tillgänglig nånstans så ni får nöja er med den lilla koden...
/* svamp */
Testa:
/* Detta är ramen för varje inlägg i artikelregistret,
i denna ram finns några css classer för att fixa utseende på
headings och länkar osv....
*/
.contentleft
{
position: relative;
float:left;
width:325px;
height:325px;
padding-bottom: 1em;
background-color: #fff;
border: 1px dashed #f30;
padding:5px;
margin:5px;
text-align:left;
}
/* nedan är titeln för varje artikel... */
.heading
{
width:50%;
border-bottom:2px dashed #999;
margin-top:-5px;
float:left;
text-align:left;
font-weight:bold;
text-decoration:none;
}
/* Nedan är css'en som jag vill alltid skall hamna längst ner till höger....
*/
.articlelink
{
position: absolute;
bottom: 0;
right: 0;
width:50%;
border:none;
text-align:right;
font-weight:bold;
font-size:10px;
text-decoration:underline;
}
Lägg in padding på #articlelink om det önskas.
Jag skulle nog ha skippat float på rubriken, utan använt ett <h1-6>-element istället. Det ser väldigt konstigt ut när artikeln börjar mitt på en rad, direkt efter rubriken.
Funkar det att du gör något sådant här?
...
.articlelink
{
[b]padding-top:100%;[/b]
width:50%;
...
Dectgap: Tack det funkar precis som jag vill, iallfall i IE och Firebird... Har inte testat med resten av världens alla browsers som läser CSS hyfssat.
JesperT: Det funkade till viss del som du gjorde, länken hamnar längst ner till höger men diven får då dubbel höjd ;) OM det ligger annan text i den redan.
Tackar och bockar...
/* svamp */