djovvio

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?

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.

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;
}

djovvio

Ti ho inviato un messaggio privato.

djovvio

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

djovvio

Grazie sono riuscito a risolvere il problema con il cellspacing tranne per il bordo inferiore del menù. La sintassi è nell'allegato. La grafica nel css non l'ho fatta io e non sono esperto. Qual'è la differenza? Potresti anche spiegarmi come centrare la grafica in IE, per farla diventare come viene visualizzata in Firefox?

djovvio

Io vedo che nel menù i bordi superiori e inferiori sono staccati rispetto all'area verde. E lo stesso vale per l'area gialla. I due bordi laterali sono distanziati.

djovvio

Ciao a tutti, premetto che non sono un esperto di css e per questo spero che voi possiate aiutarmi. La pagina in questione è questa dove ho creato l'area gialla e il menu verde attraverso css. Poi ho utilizzato Mozilla NVU per creare delle celle a lato (nell'area gialla) e in alto e in basso (nell'area verde) dove ho inserito delle immagini .gif per creare il bordo. Come potete vedere viene visualizzato correttamente con Mozilla Firefox, ma non con Internet Explorer. Posso inserire tali immagini direttamente nel foglio di stile esterno oppure come posso eliminare lo spazio tra l'area e le immagini che si vedono con IE?
Grazie anticipatamente.

djovvio

@djovvio

Post creati da djovvio