"Tabita Enig" <tabitae@stofanet.dk> writes:
Et par uddybende spørgsmål:
> Et venstre-person-kort skal indeholde et billede, der floates til venstre.
> Ved siden af billedet skal der være 2 tekster (der står under hinanden). Den
> ene tekst består af 2 linier (navn og email-adresse) og den anden tekst er
> en beskrivelse af personen. De 2 tekster kunne måske være 2 afsnit - men de
> skal i hvert fald separeres.
Ok, elementerne er:
Et kort, fuld skærmbredde, der indeholder følgende:
et billede (150pxx150px)
To linjer, navn og email, som skal være venstrejusteret i forhold til
hinanden:
Karsken Bælg Johansen
kb@email.com
En beskrivelsestekst, som blot skal være almindelige venstrejusteret tekst.
> Et højre-person-kort skal indeholde de samme 3 elementer som ovenstående,
> men billedet floater til højre og tekst1, (navn og email-adresse) floater
> ligeledes til højre, men teksten skal venstre-justeres. Tekst2 skal bare
> være venstre-justeret.
Venstrekort:
+------------------------------------------------------------------+
|+-----------+ Karsken Bælg Johansen |
|| | kb@email.com |
|| | |
|| | Karsken er en glad dreng der desværre ikke er så |
|| | meget at sige om. Hvis der var mere, ville dette |
|| | fylde nok til at komme ned under billedet, så vi |
|+-----------+ kan se at der wrappes om et flydende element. |
| Derfor skrier vi noget mere så teksten bliver længere. |
| |
| |
| |
+------------------------------------------------------------------+
Højrekort:
+------------------------------------------------------------------+
| Karsken Bælg Johansen +-----------+ |
| kb@email.com | | |
| | | |
| Karsken er en glad dreng der desværre ikke er så | | |
| meget at sige om. Hvis der var mere, ville dette | | |
| fylde nok til at komme ned under billedet, så vi | | |
| kan se at der wrappes om et flydende element. +-----------+ |
| Derfor skrier vi noget mere så teksten bliver længere. |
| |
| |
| |
+------------------------------------------------------------------+
Har jeg forstået det rigtigt? (der er ikke kant omkring kortet, men
det kunne måske være en idé :)
> Jeg har forsøgt at strukturere kortene med div, men er ikke helt sikker på
> at det er smartest - eller om jeg får det gjort for omstændigt. Mit problem
> er endvidere at nogle af kortene alligevel ikke floater rigtigt - og er ikke
> klar over hvorfor. Er der nogen, der kan sige hvorfor eller har et forslag
> til en anden måde at gøre det på?
Du floater alle tre elementer. Et floatet element tages ud af det
almindelige flow, så lige pludselig har din div.person ikke noget
indhold. Det bør være nok til at forvirre. Jeg ville nøjes med at
floate billedet.
Hvis du kunne leve med at e-mailen og navnet var højre-justerede, så
ville det være meget nemmere. Se fx
<URL:
http://www.infimum.dk/privat/vcard.html>.
Jeg bruger CSS-regler på formen
..person.lcard img {float:left;}
til at sørge for at den eneste forskel på et venstre- og et højre-kort
er i class-egenskaben for den yderste div. Det gør det nemmere at
lave en type kort om til den anden type.
Hvis e-mail-adressen skal være venstrejusteret i forhold til navnet,
så skal man være mere tricky. Jeg kan ikke lige finde en pæn måde at
gøre det på, uden at putte navn og e-mail ind i en div med fast
bredde (og om det er pænt afhænger af navnets længde).
/L
--
Lasse Reichstein Nielsen - lrn@hotpop.com
'Faith without judgement merely degrades the spirit divine.'