Ciao a tutti =) Sto impazzendo con un problema relativamente semplice, spero che qualcuno abbia una soluzione =) Ho gia' chiesto in un altro forum, ma non mi hanno risposto, forse la soluzione non era semplice come pensavo...
Ho cercato di semplificare il codice il piu' possibile, spero sia leggibile.
Il problema e' il seguente. La tabella ignora completamente le dimensioni del div in cui e' contenuta, "fuoriuscendo" da destra.
Inserendo nella tabella "margin-left:200px" le dimensioni tornano corrette. Ma non posso farlo perche' sto utilizzando scriptaculous per nascondere il div a sinistra. Quindi mettendo il margin, la tabella giustamente non si ridimensiona. Non posso neppure mettere le dimensioni in px, perche' dovra' girare su una finestra ridimensionabile (in Air)...
Come faccio? E' possibile dirgli "rimani all'interno di quel div, occupalo tutto, smettila di sforare"? =)
Vi posto un codice il piu' ridotto possibile, spero possa essere d'aiuto...
Grazie mille,
Francesco
codice:
Ho cercato di semplificare il codice il piu' possibile, spero sia leggibile.
Il problema e' il seguente. La tabella ignora completamente le dimensioni del div in cui e' contenuta, "fuoriuscendo" da destra.
Inserendo nella tabella "margin-left:200px" le dimensioni tornano corrette. Ma non posso farlo perche' sto utilizzando scriptaculous per nascondere il div a sinistra. Quindi mettendo il margin, la tabella giustamente non si ridimensiona. Non posso neppure mettere le dimensioni in px, perche' dovra' girare su una finestra ridimensionabile (in Air)...
Come faccio? E' possibile dirgli "rimani all'interno di quel div, occupalo tutto, smettila di sforare"? =)
Vi posto un codice il piu' ridotto possibile, spero possa essere d'aiuto...
Grazie mille,
Francesco
codice:
Codice:
<html>
<head>
<script type="text/javascript" src="./lib/scriptaculous/prototype.js"></script>
<script type="text/javascript" src="./lib/scriptaculous/scriptaculous.js?load=effects"></script>
</head>
<body>
<div id="left" style="background:#dee4ed;float:left;width:200px;height:100%;border-right:2px;border-right-style:groove;border-right-color:#AAA;">
<h3>Menu</h3>
</div>
<div>
<div style="height:100%;">
<div id="center">
<table style="width:100%;border-collapse:collapse;font-size:12px;">
<thead>
<tr>
<th style="border:1px solid #aaa;">Index</th>
<th style="border:1px solid #aaa;">Numeric</th>
<th style="border:1px solid #aaa;">Text</th>
<th style="border:1px solid #aaa;">Currency</th>
<th style="border:1px solid #aaa;">Date</th>
</tr>
</thead>
<tbody>
<tr>
<td>6</td>
<td>789.2</td>
<td>Jake</td>
<td>$70.94</td>
<td>2012-03-13</td>
</tr>
</tbody>
</table>
</div>
</div>
<div id="bottom_area">
<a href="#" onclick="Effect.SlideUp('left',{scaleX:true,scaleY:false}); return false;" style="width:100%;height:38px;border-top: 2px black solid;position: absolute;bottom: 0px;background-color:#FFF">Hide</a>
</div>
</body>
</html>
