WN

WN (https://www.wn.se/forum/index.php)
-   Klientsidans teknologier, design och grafik (https://www.wn.se/forum/forumdisplay.php?f=12)
-   -   Behöver tips angående ett CSS-problem (https://www.wn.se/forum/showthread.php?t=1038708)

olmatte 2009-10-22 23:14

Behöver tips angående ett CSS-problem
 
Det är så att jag vill bygga en del av en sida på följande vis:
Se bild på: http://forumbilder.se/show.aspx?iid=402220091110055449

Jag vill alltså ha divar med den formen, alltså ska texten i div1 "gå runt div två" på det sättet bilden visar, jag vet inte om det är möjligt men har du nån lösning så är jag mycket tacksam?

Osiris 2009-10-23 10:58

Tror inte det går att få till det exakt som på din bild. Mest för att din gröna div3 ska ha en smalare bredd än div2.

olmatte 2009-10-23 11:05

Det var det jag misstänkte, men tänkte bara se om någon kunde något "trix" för att lösa detta. Jag får tänka om istället då...

RLM_JP 2009-10-23 11:49

Om du skippar div 2 och bara lägger "float: right" och passande margin på dina div 3 så borde resultatet bli enligt bilden.

olmatte 2009-10-23 12:31

tack så hemskt mycket, fungerade klockrent, var dock tvungen att sätta en clear:right; på den sista smala diven för att den skulle lägga sig under den bredare även om den fick plats brevid varandra.

så här såg min lösning ut:

Citat:

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=ISO-8859-1" />
<title>Namnlöst dokument</title>
</head>
<body>
<div style="float:left; width:750px; background:#000; color:#FFF;">
<div style="float:right; width:400px; height:200px; background:#06C; color:#fff;">
hej
</div>
<div style="float:right; width:200px; height:300px; background:#F00; color:#fff; clear:right;">
hej 2
</div>
piscing elit. Etiam pulvinar sem tortor. Etiam vel erat ante, nec ultricies odio. Pellentesque vitae congue orci. Mauris pulvinar sagittis ante a sagittis. Praesent eget justo a orci volutpat tempor at eu turpis. Pellentesque lacus nibh, elementum quis vulputate quis, convallis et ipsum. Vestibulum sit amet nunc augue. Sed ligula lorem, condimentum eu euismod nec,

varius id purus. Suspendisse potenti. Fusce eget odio massa. Quisque pellentesque ante urna. Aliquam sagittis rhoncus volutpat. Phasellus massa libero, tincidunt vel lobortis sit amet, sollicitudin non massa. Quisque semper, justo ut tempus eleifend, ligula ipsum imperdiet velit, sit amet congue magna turpis ut lacus. Quisque ultrices enim ut nulla lobortis pharetra.
</div>
</body>
</html>

Nihilnovi 2009-10-23 19:21

Ett tips e att lägga allt css relaterat i en css fil och inte direkt i html sidan.

olmatte 2009-10-23 22:14

jo jag vet, men testade endast lite snabbt det jag blev tipsad om...


Alla tider är GMT +2. Klockan är nu 13:05.

Programvara från: vBulletin® Version 3.8.2
Copyright ©2000 - 2025, Jelsoft Enterprises Ltd.
Svensk översättning av: Anders Pettersson