Problemi con IE

djovvio

Non potresti darmi solo un suggerimento su come risolvere il problema? Grazie e scusa ancora.

hogudo

No, non devi scusarti

Purtroppo mi sembra che per come è stata impostata, la cosa sia risolvibile dai css con i suggerimenti che ti avevo dato sopra, ovvero sul lavoro e sulle prove, coi margini e gli spazi

Prova al limite a postare il codice intero e tutto il css :bho:

djovvio

Ti ho inviato un messaggio privato.

hogudo

Ciao, come detto in privato, se non puoi postare il codice, ti consiglio o di reperire il consenso dell'autore e postarlo oppure richiedere, come hanno fatto alcuni tuoi colleghi, lo spostamento in annunci.

Ciao
Massi

djovvio

Ecco il codice html:

[html]<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
<html>
<head>
<meta http-equiv="Content-Type"
content="text/html; charset=UTF-8">
<link rel="stylesheet" type="text/css"
href="css/stile.css">
<title>Prova</title>
</head>
<body>
<div id="container">
<div id="header">
<table style="width: 100%;">
<tbody>
<tr>
<td style="width: 20%;"><img
src="images/home.png"></td>
<td style="width: 80%;"><br>
</td>
<td style="width: 20%;"><br>
</td>
</tr>
</tbody>
</table>
</div>
<div id="menu">
<table class="rounded_box">
<tbody>
<tr>
<td><img src="images/menu_top.png"></td>
</tr>
<tr>
<td class="center">
<table id="menu_table">
<tbody>
<tr>
<td>Prova</td>
</tr>
<tr>
<td>Prova</td>
</tr>
<tr>
<td>Prova</td>
</tr>
<tr>
<td>Prova</td>
</tr>
<tr>
<td>Prova</td>
</tr>
<tr>
<td>Prova</td>
</tr>
<tr>
<td>Prova</td>
</tr>
<tr>
<td>Prova</td>
</tr>
</tbody>
</table>
</td>
</tr>
<tr>
</tr>
<tr>
<td><img src="images/menu_bottom.png"></td>
</tr>
</tbody>
</table>
</div>
<div id="content">
<table class="strange_box">
<tbody>
<tr>
<td> <img src="images/text_left.png">
</td>
<td class="main_column">Lorem ipsum dolor sit amet,
consectetuer adipiscing elit. Nunc rhoncus, eros nec dictum adipiscing,
mauris orci ornare pede, a dictum neque lacus sed ligula. Pellentesque
mollis arcu quis lorem. Sed vitae quam et mauris euismod aliquam.
Pellentesque quis nisl a ante iaculis volutpat. </td>
<td> <img src="images/text_right.png">
</td>
</tr>
</tbody>
</table>
</div>
<div id="footer">Lorem ipsum dolor sit amet, consectetuer
adipiscing elit. Nunc rhoncus, eros nec dictum adipiscing, mauris orci
ornare pede, a dictum neque lacus sed ligula. </div>
</div>
</body>
</html>
[/html]
e qui il codice css

@CHARSET "UTF-8";

html, body {
    margin: 0;
    padding: 0;
}

body, td, th, input { /* redundant rules for bad browsers  */
        font-family: verdana, sans-serif;
        font-size: 76%;
        voice-family: "\"}\"";
        voice-family: inherit;
        font-size: small;
}

body {
    background-color: #75BF21;
    background-image: url('../images/background_full.png');
    background-repeat: repeat-x;
}

div#container {
    margin: 2em auto;
    width: 760px;
}

div#header {
    width: 100%;
    text-align: center;
}

div#menu {
    float: right;
    width: 12em;
}

table#menu_table {
    text-align: center;
}

div#menu ul {
    margin: 0;
    padding: 10px;
    list-style-position: outside;
    list-style-type: none;
}

div#content {
    padding: 0;
    margin-right: 13em;
}

table.strange_box {
    margin: 0;
    padding: 0;
    border-spacing: 0;
}

table.strange_box td {
    margin: 0;
    padding: 0;
}

table.strange_box td.main_column {
    vertical-align: top;
    padding: 1em;
    border-top: 2px solid #FFFF00;
    border-bottom: 2px solid;
    background-color: #ffffa6;
}

table.rounded_box {
    margin: 0;
    padding: 0;
    border-spacing: 0;
}

table.rounded_box td {
    margin: 0;
    padding: 0;
}

table.rounded_box td.top {
    border-top: 1px solid #107a38;
    background-color: #d0ff98;
    font-size: 5px;
}

table.rounded_box td.left {
    border-left: 1px solid;
    background-color:;
}

table.rounded_box td.right {
    border-right: 1px solid;
    background-color:;
}

table.rounded_box td.bottom {
    border-bottom: 1px solid;
    background-color:;
    font-size: 5px;
}

table.rounded_box td.center {
    border-left: 1px solid;
    border-right: 1px solid;
    background-color:;
}

div#footer {
    margin-right: 13em;
    margin-top: 0.5em;
    padding-top: 0.5em;
    color:;
    text-align: center;
    font-size: 76%;
    float: clear;
}

img {
    border: 0;
}

a {
    border: 0;
}

hogudo

Innanzi tutto ti ringrazio per il caso di studio.
Me la sono cercata e l'ho portata avanti come un paleowebdesigner.

Usare css copiati da altre parti è male.
Annidare troppe tabelle è male.
Non fare come dice hogudo di sopra di mettere in tutti i table cellspacing e cellpadding a 0 è male
Non fare il conteggio dei <tr> alla fine prima dell'immagine bassa che vedi spostata è male

Se rispetti tutti e 4 i punti sarai molto felice in futuro
Se invece rispetti gli ultimi 2 e togli tutti gli spazi che non servono il tuo "sito" si vedrà bene anche con IE

Ciao

hogudo

Ah, l'ho testato sia con IE 6 che 7

djovvio

Ok grazie ora aggiungo i cellspacing e cellpadding... lo devo aggiungere su tutte le table che ho creato? Cosa intendi per conteggio dei <tr>? Dei primi due punti non ho colpa perchè la grafica mi è stata affibiata così come la vedi.

Grazie, da ora in poi seguirò il decalogo hogudo.

hogudo

Cosa intendi per conteggio dei <tr>
Che hai messo un tr in più prima dell'immagine bassa

djovvio

Perfetto ora funziona tutto! Un'ultima cosa poi ti lascio in pace: come posso centrare l'area gialla e il menu come si vede con firefox?