Hallo

Ik ben bezig met een website en ik wou graag bij ieder item de informatie zoals de datum, categorie, ... in een spry widget stoppen. Meer bepaald in een collapsibe panel.

Ik weet niet of jullie dit kennen hier is een voorbeeld: http://labs.adobe.com/technologies/spry/samples/collapsiblepanel/collapsible_panel_sample.htm

Nu heb ik er dus wat tekst rond natuurlijk. Maar als je dan op dat paneel klikt verschuift de tekst om plaatst te maken voor dat paneel. Ook andere opmaak vercshuift wat.
Nu wou ik dat paneel zou krijgen dat het over de tekst enz. 'hangt'
Ik heb al wat zitten proberen met verschillende float elemenenten in mijn divs. De positions enz. Tot nu toe geen resultaat.

Heeft iemand een idee ?


hier is de css voor als je eens wil kijken
[code]
#info is de 'container' waarmee ik dus de hele panel rechts plaats in de parent-div
#info {
width: 240px;
height: auto;
float:right;
}

.CollapsiblePanel {
z-index:100;
margin: 0px;
padding: 0px;
float:left;
}


.CollapsiblePanelTab {
font: bold 0.7em sans-serif;
background: url(../images/info.png) right center no-repeat;
margin: 0px;
padding: 0px;
width:40px;
height:40px;
cursor: pointer;
float:left;
-moz-user-select: none;
-khtml-user-select: none;
}

.CollapsiblePanelContent {
margin: 0px;
padding: 0px;
width:190px;
height:200px;
float:left;
background:#6f6f6f;
border:1px solid #787878;
z-index:500;
margin-left:5px;
overflow:hidden;
}


HTML


<div id="info">
<div id="CollapsiblePanel1" class="CollapsiblePanel">
<div class="CollapsiblePanelTab"></div>
<div class="CollapsiblePanelContent">

tekst hier


</div>
</div></div>

[code]

Alvast bedankt als iemand een oplossing heeft :)

Reageren