Avatar billede c-sharp Nybegynder
01. november 2007 - 11:19 Der er 4 kommentarer og
1 løsning

Få div i top og bund i tabel kolonne

Jeg har en tabel med x antal kolonner, i hver kolonne er der 2 divs, den ene skal placeres i toppen af kolonnen og den anden i bunden. Hvordan gør jeg det?

eks.

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
<html>
    <head>
    <title></title>
</head>

<body>

    <table border="1">
        <tr>
            <td style="width: 150px;height:100%">
                <div>
                    <strong>Overskrift</strong>
                    <p>
                        Lorem ipsum dolor sit amet, consectetuer adipiscing elit,
                        sed diam nonummy nibh euismod tincidunt ut laoreet
                        dolore magna aliquam erat volutpat.
                        Lorem ipsum dolor sit amet, consectetuer adipiscing elit,
                        sed diam nonummy nibh euismod tincidunt ut laoreet
                        dolore magna aliquam erat volutpat.
                    </p>               
                </div>
               
                <div style="width: 150px;height: 30px; background-color: black">
                    Knap
                </div>
            </td>
            <td style="width: 150px">
                <div>
                    <strong>Overskrift</strong>
                    <p>
                        Lorem ipsum dolor sit amet, consectetuer adipiscing elit,
                        sed diam nonummy nibh euismod tincidunt ut laoreet
                        dolore magna aliquam erat volutpat.
                    </p>               
                </div>
               
                <div style="width: 150px;height: 30px; background-color: black;absolute:relative;bottom:10px;">
                    Knap
                </div>
            </td>
        </tr>
        <tr>
            <td style="width: 150px">
                <div style="">
                    <strong>Overskrift</strong>
                    <p>
                        Lorem ipsum dolor sit amet, consectetuer adipiscing elit,
                        sed diam nonummy nibh euismod .
                    </p>               
                </div>
               
                <div style="width: 150px;height: 30px; background-color: black">
                    Knap
                </div>
            </td>
            <td style="width: 150px">
                <div>
                    <strong>Overskrift</strong>
                    <p>
                        Lorem ipsum dolor sit amet, consectetuer adipiscing elit,
                        sed diam nonummy nibh euismod tincidunt ut laoreet
                        dolore magna aliquam erat volutpat.
                    </p>               
                </div>
               
                <div style="width: 150px;height: 30px; background-color: black">
                    Knap
                </div>
            </td>
        </tr>
    </table>

</body>
</html>
Avatar billede roenving Novice
01. november 2007 - 17:08 #1
Hvis de skal have forskellige højder, skal du sætte højder på cellerne og benytte position:absolute;bottom:0; på de nederste ...

-- men ville det ikke være lettere at sætte en ekstra række ind til knapperne ?-)
Avatar billede c-sharp Nybegynder
02. november 2007 - 08:50 #2
Hej roenving, tak for dit svar!

problemet er at indholdet er dynamisk, så det er mig ikke muligt at lave den ekstra række. Men jeg har heller ikke mulighed for at sætte en højde på cellen. kan det så ikke lade sig gøre?
Avatar billede roenving Novice
03. november 2007 - 13:06 #3
Hvorfor giver det problemer at indholdet er dynamisk, for du kan jo bare udelade rækken, hvis der ingen knapper skal være ?-)
Avatar billede c-sharp Nybegynder
05. november 2007 - 09:35 #4
Jeg bruger en asp.net DataList og den generere selv tabellen, jeg skal bare fylde i cellerne, derfor kunne det være nemt hvis jeg i hver celle kunne justere placeringerne af elementerne.
Avatar billede c-sharp Nybegynder
12. december 2007 - 13:02 #5
Roenving tak for dine kommentare! fandt aldrig en løsning på problemet, men fandt på noget andet.
Avatar billede Ny bruger Nybegynder

Din løsning...

Tilladte BB-code-tags: [b]fed[/b] [i]kursiv[/i] [u]understreget[/u] Web- og emailadresser omdannes automatisk til links. Der sættes "nofollow" på alle links.

Loading billede Opret Preview
Kategori
Vi tilbyder markedets bedste kurser inden for webudvikling

Log ind eller opret profil

Hov!

For at kunne deltage på Computerworld Eksperten skal du være logget ind.

Det er heldigvis nemt at oprette en bruger: Det tager to minutter og du kan vælge at bruge enten e-mail, Facebook eller Google som login.

Du kan også logge ind via nedenstående tjenester