Zorgen dat een Image de Div Wrapt

Overzicht Reageren

Sponsored by: Vacatures door Monsterboard

JunkieXP

JunkieXP

18/06/2007 13:12:00
Quote Anchor link
Ik zit nu al enige tijd te piekeren hoe ik nu de tekstuitloop van een Div kan veranderen door er een image in te zetten, uiteindelijk is het me met Float gelukt maar dit is volgens mij niet de oplossing die hoord, gezien deze eigenlijk gelijk opsplits in 2 seconde, terwijl het de bedoeling is dat onderaan de image de Div zijn tekst weer neer mag gooien, eigenlijk moet de tekst dus alleen om de image heen manouvreren.

Ik heb nu dit: http://school.junkiexp.com/3.2/_.WiVE/front/ hopend kan iemand mij verder helpen :).
 
PHP hulp

PHP hulp

09/05/2021 22:22:27
 
GaMer B

GaMer B

18/06/2007 13:16:00
Quote Anchor link
Is makkelijk te doen door middel van: align="right" / align="left" in de img tag te zetten.
Zie hier voor live voorbeeld
 
JunkieXP

JunkieXP

18/06/2007 13:21:00
Quote Anchor link
Jamaar dat is niet 1 Div die doorloopt, dat zijn meerdere content blokken die dmv de <p> tag worden geenterd naar een volgende regel en daardoor dus in dat andere blok weer de volledige breedte te gebruiken, ik wil zorgen dat 1 blok zichzelf op een gegeven moment weer kan uitstrekken.
 
Joren de Wit

Joren de Wit

18/06/2007 13:48:00
Quote Anchor link
http://www.glish.com/css/1.asp

Dit is wat je zoekt?
 
JunkieXP

JunkieXP

18/06/2007 14:14:00
Quote Anchor link
dat is wel wat ik zoek, maar kom er niet precies uit wat er nu bedoeldt wordt, want zie zo 1 2 3 geen CSS die dit afhandelt, kan iemand hier een voorbeeld van maken adhv de Div's .Content en .ImageBox
 
Joren de Wit

Joren de Wit

18/06/2007 14:19:00
Quote Anchor link
De CSS staat toch echt duidelijk in beeld in de twee divs zelf...

Maar goed, om het voorbeeld letterlijk over te nemen:
Code (php)
PHP script in nieuw venster Selecteer het PHP script
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
<html>
<head>
<style type="text/css">

#main {
    border:1px solid #000;
    background:#fff;
}
#main #menu {
    border-left:1px solid #000;
    border-bottom:1px solid #000;
    float:right;
    width:230px;
    background:#eee;
    margin:0px 0px 10px 10px;
}

</style>
</head>

<body>
<div id="main">
    <div id="menu">
        <p>Dit hier is je image box...</p>
    </div>
    
    <p>Hier komt je main content...</p>
    <p>En om te zien dat het werkt</p>
    <p>Stoppen we er ook nog een paar extra regels tekst in, die zo lang zijn dat ze ook nog onder de imagebox uitkomen zodra je je scerm verkleint.</p>
</div>
</body>

</html>

En nu maar eens spelen met de breedte van je scherm om te zien wat er gebeurt.
 
JunkieXP

JunkieXP

18/06/2007 14:22:00
Quote Anchor link
Ow dus toch dat stuk code, ik was echt aan het zoeken naar een bepaalde Wrap notatie oid, thx anyway works now :)

Het enige wat je eigenlijk hoeft te doen is de ImageBox rechts te laten floaten, en geen float meegeven aan de content waar de Image in staat.
Gewijzigd op 01/01/1970 01:00:00 door JunkieXP
 
Joren de Wit

Joren de Wit

18/06/2007 14:48:00
Quote Anchor link
Jup, en natuurlijk die imagebox onderdeel maken van de omvattende div (#main #menu {} uit het voorbeeld), anders zal hij aan de rechter kant van je beeldscherm floaten...
Gewijzigd op 01/01/1970 01:00:00 door Joren de Wit
 



Overzicht Reageren

 
 

Om de gebruiksvriendelijkheid van onze website en diensten te optimaliseren maken wij gebruik van cookies. Deze cookies gebruiken wij voor functionaliteiten, analytische gegevens en marketing doeleinden. U vindt meer informatie in onze privacy statement.