Permalänk
Medlem

css-fråga

Har en css-fråga. Se koden (tyvärr har jag ingen möjlighet att ladda upp den på nån ftp just nu)

<div style="height:300px; width:300px; background-color:#CCC; position:relative"> <p style="text-align:left">Lorem ipsum dolor sit amet, consetetur sadipscing elitr, sed diam nonumy eirmod tempor invidunt ut labore et dolore magna aliquyam erat, sed diam voluptua. At vero eos et accusam et justo duo dolores et ea rebum. Stet clita kasd gubergren, no sea takimata sanctus est Lorem ipsum dolor sit amet. Lorem ipsum dolor sit amet, consetetur sadipscing elitr, sed diam nonumy eirmod tempor invidunt ut labore et dolore magna aliquyam erat, sed diam voluptua. At vero eos et accusam et justo duo dolores et ea rebum. Stet clita kasd gubergren, no sea takimata sanctus est Lorem ipsum dolor sit amet.</p> <div style="position:absolute; bottom:0px; right:0px; background-color:red; width:150px; height:150px;"> </div> </div>

Finns det nått sätt att med hjälp av css få texten att inte gå under den röda diven?

Permalänk
Medlem

Nja, kanske med z-index, beror på hur du menar. Vad är det du försöker göra?
Varför absolutpositionerar du en tom div?

Permalänk
Medlem

Du menar typ att du vill ha den röda diven som bakgrund till texten?

Visa signatur

"Memory is like an orgasm. It's a lot better if you don't have to fake it." - Seymore Cray

Permalänk
Medlem

Ursäkta för att min förklaring var för sparsam.
Den röda diven ska egentligen vara en bild och texten ska vara en dynamisk text med olika längd som jag inte vill att den går över/under den röda diven (el bilden).
Z-index lägger ju bara element över el under varandra så det kan jag inte använda. Men på nått sätt måste det ju gå...?

Permalänk
Medlem

Floata diven istället. Förslagsvis åt vänster. Bort med abs. pos.
(Det är sånt här floats egentligen är till för)
Edit: Såg inte bottom:0px. Behåll abs. pos., men endast bottom:0 och inte left:0.

Permalänk
Medlem
Skrivet av You:

Floata diven istället. Förslagsvis åt vänster. Bort med abs. pos.
(Det är sånt här floats egentligen är till för)
Edit: Såg inte bottom:0px. Behåll abs. pos., men endast bottom:0 och inte left:0.

Hur menar du? Jag vill ju att den röda diven alltid behåller samma possition oavsett som texten är lång el kort.

Permalänk
Medlem

Det du vill göra går inte att göra med absolut positionering.
Det borde gå att floata elementet till höger och sedan tvinga det till botten, men det är lite svårt.
Edit: Det du vill göra är i princip att floata bilden både åt höger och så att det ligger längst ner i sin förälder. Den här frågan på Stack Overflow är ekvivalent, du kan ju se om några av svaren funkar i ditt fall. Det verkar vara "omöjligt".

Permalänk

Nu vet jag inte exakt vad du vill ha, men kan du inte ge container diven padding-bottom: *röda divens höjd* och placera röda diven bottom: 0?

Permalänk
Medlem
Skrivet av Cloudburst:

Nu vet jag inte exakt vad du vill ha, men kan du inte ge container diven padding-bottom: *röda divens höjd* och placera röda diven bottom: 0?

Då kan jag inte få texten att wrappa så här (stjärna =bild, fyrkant=text):
####
####
##**
##**
utan det kommer bli så här
####
####
**
**

Skrivet av You:

Det du vill göra går inte att göra med absolut positionering.
Det borde gå att floata elementet till höger och sedan tvinga det till botten, men det är lite svårt.
Edit: Det du vill göra är i princip att floata bilden både åt höger och så att det ligger längst ner i sin förälder. Den här frågan på Stack Overflow är ekvivalent, du kan ju se om några av svaren funkar i ditt fall. Det verkar vara "omöjligt".

Är nog tyvärr som du säger att det är omöjligt... synd...

Tack ändå alla!