I've got an issue with rich:calendar that doesn't show at the right place when inside a scrolling div.
in my page ( see below) i have a list of data with a rich:calendar for each row in a column. when i scroll down and then click on the calendar, it doesn't show where it should. it doesn't take in account the scrollsize...
my template (simplified):
<body> <div id="entetePage" /> <div id="milieuPage"> <div id="navigation" /> <div id="contenu"> <div id="menu"/> <div id="page"/> </div> </div> <div id="piedPage"/> </body>
/* Styles Globaux Standards : */ html, body { margin: 0; padding: 0; border:0 none; overflow: hidden; height: 100%; } img { border: 0 none; } div { margin: 0; padding: 0; } /* Premiere decoupe : */ .entetePage { display: block; height: 50px; z-index: 10; } .milieuPage { display: block; height: 500px; z-index: 0; } .piedPage { display: block; height: 48px; z-index: 10; } /* Seconde decoupe : */ .navigation{ display: block; height: 38px; z-index: 10; } .contenu { position: absolute; top: 88px; /*height: 400px;*/ z-index: 10; } .hiddenDiv { display:none; } /* Decoupe contenu : */ .menu { position: absolute; display: none;/* menu cache : none; menu visible : block; */ background-color: #F8F3F7; top: 0px; left: 0; width: 200px; height: 450px; z-index: 100; } .page { position: absolute; top: 0px; left: 0px;/* menu cache : 0px; menu visible : 200px; */ width: 100%;/* menu cache : 100%; menu visible : 800px; */ height: 450px; z-index: 25; overflow: auto; }
is there anybody that knows why calendards are not well positionned when inside a scrolling div (position absolute) ?