[TYPO3-UG Italy] alcuni problemi tra IE7 / IE6 / FF

Tue May 29 15:00:37 CEST 2007

Ma vuoi una soluzione Unica per tutti i browser?

Giulia Mora wrote:

> Ciao Ragazzi,
> 
> scusate se il mio argomento è OT (malgrado sia un template di typo3) ma
> davvero non so più dove sbattere la mia testolina ...
> 
> ho questo codice:
> 
> ********************
> <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"
> "http://www.w3.org/TR/html4/loose.dtd">
> <html>
> <head>
> <meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1" />
> 
> <style type="text/css">
> img {
>     background-color: black;
> }
> body {
>     text-align: center;   /*centra in IE 5.x */
> }
> ..ripristino-float {
> clear: both;
> height: 0px;
> }
> /* GENERAL fonts */
> * {
> padding: 0px 0px;
> margin: 0px 0px;
> border: 0px;
> font-family: arial, helvetica, sans-serif;
> }
> p {
> font-size: 12px;
> }
> hr {
> display: none
> }
> /* CONTAINER */
> div#container {
> margin: 10px auto 10px auto;
> border: #999 1px solid;
> width: 990px;
> position: relative;
> text-align: left;
> 
> background-color: #CCCCCC;
> }
> /* HEADER */
> div#header_box {
> padding: 6px 0px 0px 0px;
> 
> background-color: #FFFFCC;
> }
> /* logo */
> div#header_logo {
> margin: 0px 0px 0px 40px;
> width: 190px;
> height: 90px;
> float: left;
> /*background: url(../images/logo.jpg) 0px 0px no-repeat;*/
> }
> /* horizontal menu */
> div#menux {
> margin: 0px 0px 0px 263px;
> height: 90px;
> 
> background-color: #FFCC66;
> }
> TD.menux_level_no, TD.menux_level_act {
> padding: 52px 30px 16px 30px;
> border-left: 1px #CCC solid;
> color: #666;
> font-size: 10px;
> text-transform: uppercase;
> background: url(../images/label.gif) no-repeat 20px 40px;
> 
> background-color:#FFCCCC;
> }
> div.menux_level1_act {
> font-weight: bold;
> }
> TD.menux_level_no a, TD.menux_level_act a, TD.menux_level_no a:hover {
> padding: 0px 0px 3px 0px;
> color: #666;
> text-decoration: none;
> }
> TD.menux_level_no a {
> border-bottom: #CCCCCC 3px solid;
> }
> TD.menux_level_no a:hover, TD.menux_level_act a {
> border-bottom: #FF6600 3px solid;
> }
> /* content */
> div#header_content {
> padding: 0px 0px 0px 266px;
> height: 300px;
> background-color: #000000;
> }
> /* FOOTER */
> div#bottom_box {
> padding: 4px 0px;
> height: 16px;
> font-size: 10px;
> background-color: #EEE;
> color: #666;
> }
> /* MAIN */
> div#main_box {
> margin: 0px auto;
> clear: both;
> }
> /* left columns */
> div#left_box {
> margin: 10px 0px;
> width: 266px;
> float: left;
> }
> /* content_box */
> div#content_box {
> margin: 10px;
> width: 704px;
> font-size: 11px;
> float: left;
> }
> div#content {
> float: left;
> padding: 0px 0px;
> margin: 16px 0px;
> }
> /* vertical menu */
> div#menuy {
> width: 244px;
> height: 400px;
> position: absolute;
> top: 110px;
> left: 10px;
> background: url(../images/bgmenuy2.gif) 0 0 no-repeat;
> background-color: #FFF;
> opacity: .90;
> filter: alpha(opacity=90);
> -moz-opacity: 0.9;
> }
> 
>   </style>
> 
> <title>New Body Gym</title>
> <meta name="generator" content="TYPO3 4.1 CMS" />
> 
> </head>
> <body>
> 
> <div id="container">
> 
> <div id="header_box">
> 
> <div id="header_logo">
> LOGO
> </div>
> 
> <div id="menux">
> <table>
> <tr height="20">
> <TD class="menux_level_no"> <a href="#" onfocus="blurLink(this);"  >MENU
> 5</a> </TD><TD class="menux_level_no"> <a href="#"
> onfocus="blurLink(this);"
>   >MENU 2</a> </TD><TD class="menux_level_act"><a href="#"
> onfocus="blurLink(this);"  >MENU 3</a></TD><TD class="menux_level_no"> <a
> href="#" onfocus="blurLink(this);"  >MENU 4</a> </TD>
> </tr>
> </table>
> </div>
> 
> <div class="ripristino-float"></div>
> 
> <div id="header_content"></div>
> CONTENT
> </div>
> 
> <hr />
> 
> <!--###main_box### begin -->
> <div id="main_box">
> 
> <div id="left_box">
> 
> <div id="menuy">
> MENU
> </div>
> 
> <div id="content_box">
> 
> CONTENT</div>
> 
> </div>
> 
> </div>
> <!--###main_box### end -->
> 
> <hr />
> <div class="ripristino-float"></div>
> 
> <div id="bottom_box">
> FOOTER
> </div>
> 
> </body>
> </html>
> ********************
> 
> con IE7 il menu arancione si vede perfettamente (o meglio, come vorrei io)
> con FF i menu singoli (rosa) sono più lunghi e con IE6 addirittura viene
> inventato uno spazio tra il menu e il contenuto (zona nera)... come posso
> risolvere?
> 
> grazie a tutti in anticipo
> Giulia
> 
> _________________________________________________________________
> Push the button! Crea il tuo blog e fatti vedere...
> http://pushthebutton2006.spaces.live.com/

-- 
WEB develop e Linux Fanatic