codice:<div id="set8"> </div> <div id="set7"> </div> <div id="set6"> </div> <div id="set5"> </div> <div id="set4"> </div> <div id="set3"> </div> <div id="set2"> </div> <div id="set1"> </div> </div> <div id="echo"> Select a range...</p> [img]./imm/buttStart.png[/img] </div> <object type="application/x-shockwave-flash" data="./snd/snds.swf" swliveconnect="true" id="snds" /> </div> <div id="interact"> <h4>Interact</h4> <div class="button" id="buttons_interact"> <div id="int12"> 8</p> </div> <div id="int11"> +7</p> </div> <div id="int10"> -7</p> </div> <div id="int9"> +6</p> </div> <div id="int8"> -6</p> </div> <div id="int7"> 5</p> </div> <div id="int6"> -5</p> </div> <div id="int5"> 4</p> </div> <div id="int4"> +3</p> </div> <div id="int3"> -3</p> </div> <div id="int2"> +2</p> </div> <div id="int1"> -2</p> </div> </div> </div> <div id="options"> <h4>Options</h4> [img]./imm/buttScore.png[/img] <div id="score"> <h4>Score</h4> <table> <thead> <th> <h3> Interval </h3> </th> <th> <h3> Done </h3> </th> <th> <h3> Guess </h3> </th> <th> <h3> % </h3> </th> </thead> <tfoot> <tr> <td> <p class="label" id="total"> Total: </p> </td> <td> 0 </p> </td> <td> 0 </p> </td> <td> 0 </p> </td> </tr> </tfoot> <tbody> <tr> <td> <p class="label"> Perfect Octave </p> </td> <td> 0 </p> </td> <td> 0 </p> </td> <td> 0 </p> </td> </tr> <tr> <td> <p class="label"> Major Seventh </p> </td> <td> 0 </p> </td> <td> 0 </p> </td> <td> 0 </p> </td> </tr> <tr> <td> <p class="label"> Minor Seventh </p> </td> <td> 0 </p> </td> <td> 0 </p> </td> <td> 0 </p> </td> </tr> <tr> <td> <p class="label"> Major Sixth </p> </td> <td> 0 </p> </td> <td> 0 </p> </td> <td> 0 </p> </td> </tr> <tr> <td> <p class="label"> Minor Sixth </p> </td> <td> 0 </p> </td> <td> 0 </p> </td> <td> 0 </p> </td> </tr> <tr> <td> <p class="label"> Perfect Fifth </p> </td> <td> 0 </p> </td> <td> 0 </p> </td> <td> 0 </p> </td> </tr> <tr> <td> <p class="label"> Diminished Fifth </p> </td> <td> 0 </p> </td> <td> 0 </p> </td> <td> 0 </p> </td> </tr> <tr> <td> <p class="label"> Perfect Fourth </p> </td> <td> 0 </p> </td> <td> 0 </p> </td> <td> 0 </p> </td> </tr> <tr> <td> <p class="label"> Major Third </p> </td> <td> 0 </p> </td> <td> 0 </p> </td> <td> 0 </p> </td> </tr> <tr> <td> <p class="label"> Minor Third </p> </td> <td> 0 </p> </td> <td> 0 </p> </td> <td> 0 </p> </td> </tr> <tr> <td> <p class="label"> Major Second </p> </td> <td> 0 </p> </td> <td> 0 </p> </td> <td> 0 </p> </td> </tr> <tr> <td> <p class="label"> Minor Second </p> </td> <td> 0 </p> </td> <td> 0 </p> </td> <td> 0 </p> </td> </tr> </tbody> </table> [img]./imm/buttReset.png[/img] [img]./imm/buttClose.png[/img] </div> </div> </div> <div id="money"> <h4>Money</h4> </div> <div> <object id="logo" type="image/svg+xml" data="./imm/logo.svg" /> </div> </body> </html>Verso la fine dell' html vedete delle img, non riesco a posizionarle al centro (orizzontalmente) nemmeno con dei div contenitori, non ci sono output di errori. Ci riesco solo con aggiungendo la proprietà "display : block" ma anche così non viene benissimo. Forse img non ha la proprietà margin?codice:body { background-image : url('../imm/logoBack.png'); } div { overflow : hidden; border-color : black; border-width : thin; border-style : solid; margin : auto; background-color : snow; } p, h4, h3 { margin : auto; font-family : sans-serif; font-weight : normal; } h3 { margin-left : 20%; margin-right : 20%; } table, th, td { border-color : black; border-width : thin; border-style : solid; margin : auto; border-collapse : collapse; } table { margin-top : 5%; } table p { margin : auto; text-align : center; } #application { height : 800px; width : 50%; background-color : #AFEEEE; border-color : #B0E0E6; border-style : solid; border-width : 10px; } #money { margin-top : 8%; width : 56%; height : 500px; background-color : #E0FFFF; } #logo { border : none; overflow : hidden; position : fixed; bottom : 0; left : 0; width : 31.9%; height : 15%; } #set { float : left; width : 35%; height : 60%; margin-left : 10%; margin-top : 15%; } #interact { margin-right : 10%; float : right; width : 25%; height : 80%; } #options { margin-top : 106%; height : 14%; width : 90%; } #icon { margin : auto; margin-top : 0.5%; border : none; height : 16.65%; width : 47.5%; } .button { border : none; height : 50%; width : 20%; } .button div { margin : auto; border-color : #008B8B; height : 7.5%; width : 55%; background-color : #90EE90; } #interact .button { height : 97%; width : 60%; } #interact .button div { height : 8%; width : 98%; } #echo { margin-top : 5%; border : none; height : 25%; width : 90%; text-align : center; } #echo p { font-weight : bold; margin-top : 25%; } #interact div p { line-height : 0; margin-top : 30%; font-weight : bold; display : none; text-align : center; font-size : 410%; } #echo img { margin-top : 4.75%; display : none; } #score { display : none; position: absolute; height : 50%; width : 42.75%; z-index: +1; } p.label { text-align : left; font-weight : bold; margin-right : 12%; } #total.label { font-weight : normal; text-align : right; margin-right : 3%; } img { margin : auto; }
Rispondi quotando