Följ Black Week på SweClockers
Forum Mjukvara Programmering och digitalt skapande Tråd Inlägg

css-fråga

1
Skriv svar
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?

Redigera
Citera flera Citera
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?

Visa signatur

Blogg. Webboken. Pinboard, Last.fm, Facebook, Kongregate. W3fools.
Validera din HTML, men skryt inte om att du gör det.
Använd HTML5 och kom ihåg semantiken!

Redigera
Citera flera Citera
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

Redigera
Citera flera Citera
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å...?

Redigera
Citera flera Citera
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.

Visa signatur

Blogg. Webboken. Pinboard, Last.fm, Facebook, Kongregate. W3fools.
Validera din HTML, men skryt inte om att du gör det.
Använd HTML5 och kom ihåg semantiken!

Redigera
Citera flera Citera
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.

Gå till inlägget

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

Redigera
Citera flera Citera
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".

Senast redigerat
Visa signatur

Blogg. Webboken. Pinboard, Last.fm, Facebook, Kongregate. W3fools.
Validera din HTML, men skryt inte om att du gör det.
Använd HTML5 och kom ihåg semantiken!

Redigera
Citera flera Citera
Permalänk
Medlem
●

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?

Redigera
Citera flera Citera
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?

Gå till inlägget

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".

Gå till inlägget

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

Tack ändå alla!

Redigera
Citera flera Citera
1
Skriv svar