Posto qui perchè è stato creato in CSS la maggior parte del lavoro che vi descrivo:
Con lo scopo di creare una sorta di "menù a schede", ho creato una tabella in cui, sulla prima riga, ci sono le varie "opzioni" disponibili (7 celle), in una seconda riga c'è una sola cella (con colspan=7) in cui appare un testo che varia a seconda dell'opzione scelta.
Il mio problema è che quando il testo supera la grandezza della tabella, quest'ultima si allarga a dismisura. Preferirei che la tabella rimanesse sempre fissa ed il testo andasse a capo automaticamente. E' possibile fare questo?
Cercando in vari forum, post e robbe varie ho letto che basterebbe settare un "width=xXx" per risolvere il tutto. A me ciò non mi funziona
questo è il mio problema
vi posto codice html e css e vi mando alla visualizzazione del mio problema:
il file .PHP
il File .CSScodice:<link rel="StyleSheet" href="soreta.css" type="text/css"> <body onLoad=disable()> <table class=titolo> <tr> <td> <div id="titolo1" class=sele onClick="mostraMenu('1')">Antipasti</div> </td> <td> <div id="titolo2" onClick="mostraMenu('2')">Primi</div> </td> <td> <div id="titolo3" onClick="mostraMenu('3')">Secondi</div> </td> <td> <div id="titolo4" onClick="mostraMenu('4')">Pizze</div> </td> <td> <div id="titolo5" onClick="mostraMenu('5')">Contorni</div> </td> <td> <div id="titolo6" onClick="mostraMenu('6')">Dessert</div> </td> <td> <div id="titolo7" onClick="mostraMenu('7')">Bevande</div> </td> <tr> <td id=stilert colspan=7> <div id="scelte1" class=>AntipastiAntipastiAntipastiAntipastiAntipastiAntipastiAntipastiAntipastiAntipastiAntipastiAntipastiAntipastiAntipastiAntipastiAntipastiAntipastiAntipastiAntipastiAntipastiAntipastiAntipastiAntipasti</div> <div id="scelte2" >Primi</div> <div id="scelte3" >Secondi</div> <div id="scelte4" >Pizze</div> <div id="scelte5" >Contorni</div> <div id="scelte6" >Dessert</div> <div id="scelte7" >Bevande</div></td> </tr> </table> </body> <script type="text/javascript"> scelte = "1"; function disable() { <?php for ($i=1;$i<8;$i++) { echo "document.getElementById(\"titolo$i\").style.cursor=\"pointer\"; "; echo "document.getElementById(\"scelte$i\").style.display=\"none\"; "; } ?> document.getElementById("scelte1").style.display="inline"; } function mostraMenu(val) { if (val==scelte) return; id="titolo"+val; document.getElementById(id).style.background = "white"; id = "scelte"+val; document.getElementById(id).style.display="inline"; temp="titolo"+scelte; document.getElementById(temp).style.background = "#66CCCC"; temp = "scelte"+scelte; document.getElementById(temp).style.display="none"; scelte=val; } </script>
http://marcoilsagace.altervista.org/asd.phpcodice:.titolo { text-align:center; font-family:sans-serif; font-size:125%; font-weight:bold; color:navy; background:#66CCCC; width:70%; height:1.2em; border: solid; border-color: navy; } .sele { background: white; } #stilert { color: black; font-size: medium; font-weight: normal; }
Rispondi quotando