CSS-definitie voor twee evenhoge boxen
Graag vraag ik jullie hulp voor het volgende:
Op mijn genealogie-site heb ik van ieder persoon een zgn. persoonskaart
Deze kaart bestaat in hoofdzaak uit twee delen, t.w. een algemeen deel en een specifiek deel.
Nu is het zo dat de hoogte van het kader in het algemene deel wordt bepaald door het aantal kinderen dat bij deze persoon hoort. Het kader van het specifieke deel blijft altijd gelijk.
Nu wil ik met behulp van CSS de hoogte van het rechterkader automatisch even hoog laten worden als het linker kader.
Kijk voor wat ik bedoel met deze link: http://vanbaasbank.nl/persoonskaart.php?id=i_I1022770573#bovenaan
Mijn CSS-code is:
Code (php)
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
.tagline_450_links {
float: left;
width: 400px;
min-height: 650px;
border: 1px solid #CCCCCC;
border-radius: 6px;
-webkit-box-shadow: 6px 6px 9px #ddd;
box-shadow: 6px 6px 9px #ddd;
}
.tagline_450_rechts {
float: right;
width: 490px;
min-height: 550px;
font-size: 10px;
}
.tagline_450_tabs {
min-height: 600px;
border: 1px solid #CCCCCC;
border-radius: 6px;
-webkit-box-shadow: 6px 6px 9px #ddd;
box-shadow: 6px 6px 9px #ddd;
}
float: left;
width: 400px;
min-height: 650px;
border: 1px solid #CCCCCC;
border-radius: 6px;
-webkit-box-shadow: 6px 6px 9px #ddd;
box-shadow: 6px 6px 9px #ddd;
}
.tagline_450_rechts {
float: right;
width: 490px;
min-height: 550px;
font-size: 10px;
}
.tagline_450_tabs {
min-height: 600px;
border: 1px solid #CCCCCC;
border-radius: 6px;
-webkit-box-shadow: 6px 6px 9px #ddd;
box-shadow: 6px 6px 9px #ddd;
}
Ik heb inmiddels ontdekt dat de css-code tagline_450_tabs ergens moet worden aangepast
George
Gewijzigd op 02/02/2015 13:08:13 door George van Baasbank
hier beschreven.
- gebruik een table
- gebruik een css hack (grote negatieve margin-bottom, grote positieve margin-padding)
- gebruik een andere css hack (geklooi met absolute en relative)
- gebruik een JavaScript snippet voor de bepaling van de hoogste kolom, en geef de andere kolom die hoogte
EDIT: ik ga er overigens vanuit dat dit soort persoonlijke gegevens normaal niet zomaar op te vragen zijn? Hier is toch een (privacy)wetgeving voor?
Meerdere oplossingen, alle staan - gebruik een table
- gebruik een css hack (grote negatieve margin-bottom, grote positieve margin-padding)
- gebruik een andere css hack (geklooi met absolute en relative)
- gebruik een JavaScript snippet voor de bepaling van de hoogste kolom, en geef de andere kolom die hoogte
EDIT: ik ga er overigens vanuit dat dit soort persoonlijke gegevens normaal niet zomaar op te vragen zijn? Hier is toch een (privacy)wetgeving voor?
Gewijzigd op 02/02/2015 14:31:34 door Thomas van den Heuvel