Gå til innhold

Tekst nederst i en div

haakoo

Av haakoo
i Programmering og webutvikling

Anbefalte innlegg

Videoannonse

Videoannonse
Annonse
Cobos

Cobos

Skrevet
Skrevet

Det er en offisiell "metode" det å ha noen store relative positioned container divs rundt innholdet ditt, så kan du bruke absolute position til å ordne innholdet ditt inne i den container div'en. Funker ihvertfall fint for meg :)

 

Cobos

Lenke til kommentar
prøvekanin

prøvekanin

Skrevet
Skrevet (endret)

Testet med denne koden, og det funket helt fint (Se resultatet her):

 

HTML:

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="no" lang="nb-NO">

<head>
<title>test</title>
<link rel="stylesheet" type="text/css" href="style.css" />
<meta http-equiv="Content-Type" content="application/xhtml+xml; charset=iso-8859-1" />
</head>

<body>

<div id="container">
<p>Litt tulletekst her og litt dilldall-ting.</p>
</div>

</body>

</html>

 

CSS:

#container {
position: relative;
margin: 0px auto;
text-align: center;
height: 400px;
width: 600px;
border: 1px solid #000;
}

#container p {
position: absolute;
bottom: 0;
right: 0;
padding: .5em;
}

 

:)

Endret av prøvekanin
Lenke til kommentar
FuLu

FuLu

Skrevet
Skrevet

Som prøvekanin har bevist, så funker det ja.

 

Eneste minus med metoden, er at når annet innhold i div'en kommer seg ned i bunn, vil den posisjonerte p'en legge seg over.. så det kan være en ide å legge til margin/padding i bunnen på det siste elementet som ikke er posisjonert i den diven.

 

<div>
<h2>tittle</h2>
<p>masse tekst</p>
<p class="pad_meg_i_bunn">enda mere tekst med padding i bunn så jeg ikke kommer under den under meg ;)</p>
<p class="bunn">jeg er alltid nederst til høyre i div'en</p>
</div>

Lenke til kommentar

Opprett en konto eller logg inn for å kommentere

Du må være et medlem for å kunne skrive en kommentar

Opprett konto

Det er enkelt å melde seg inn for å starte en ny konto!

Start en konto

Logg inn

Har du allerede en konto? Logg inn her.

Logg inn nå
Gå til emneliste
×
×
  • Opprett ny...