problema sovrapposizione div in sito responsive

dukeilduca

Nuovo Utente
5 Feb 2008
8
0
0
ciao a tutti,
vi espongo subito il mio problema... sto creando un sito responsive e di certo non sono un drago ma mi sto impegnando per farlo da me...

Per ora sono riuscito a fare più o meno tutto quello che mi serviva (magari non tutto il codice sarà perfetto e pulito, ma per ora mi sembra andare bene...). C'è però un problema che non riesco a risolvere:

quando riduco la finestra del mio browser per fare in modo che tutta la pagina venga visualizzata su di un'unica colonna, il menu non mi viene centrato e l'immagine nella homepage va a finire in parte sopra al menu coprendolo e rendendolo quindi inaccessibile... qualcuno sa dirmi dove sbaglio?

di seguito il sito per mostrarvi l'errore:
http://angoloduke.altervista.org (provate a restringere sempre più la finestra fino a quando il menu si trasforma..)

e quì il codice css che ho utilizzato:
HTML:
/* CSS Document - Dak ideas */

* { margin: 0; padding: 0; }
html { overflow-y: scroll; }
body { background: #e0dcc6; color: #666666; font-family: Arial, Helvetica, sans-serif; font-size: 1,5%;}
ol, ul {list-style: none; margin: 0; }
ul li { margin: 0; padding: 0; }
h1 { }
footer, header, hgroup, menu, nav, section { 
display: block;
}

/* --- da terminare tutto il pezzo sopra --- */

/* --- struttura --- */
#wrapper {
min-width: 302px;
width: 96%;
max-width: 920px;
margin: auto;
padding: 0;
background: #FFFFFF;
}

#header-img {
height: 27px;
background: url(../img/header.png) repeat-x;
margin-bottom: 30px;
}

/* Logo H1 */
header #logo {
background: url(../img/logo.png) no-repeat;
height: 100px;
width: 301px;
float: left;
display: block;
text-indent: -9999px;
margin-bottom: 30px;
}

#main100 {
width: 98%;
margin: auto;
float: left;
padding-left: 1%;
padding-right: 1%;
text-align: justify;
padding-bottom: 1%;
}

#main60 {
width: 56%;
margin-right: 5%;
float: left;
padding-left: 1%;
padding-right: 1%;
text-align: justify;
padding-bottom: 1%;
}

#submain35 {
width: 33%;
float: right;
padding-left: 1%;
padding-right: 1%;
text-align: justify;
}

#footer {
margin-top: 5%;
width: 100%;
margin-right: 5%;
float: left;;
text-align: center;
background: url(../img/footer.png) repeat-x;
height: 148px;
color: #FFFFFF;
}

#footer-text {
padding-top: 70px;
}

#clear {
clear: both;
}

/* --- menu --- */
#menu-img {
background: url(../img/menu.png) no-repeat;
width: 572px;
height: 100px;
float: right;
}

header #menu {
text-align: right;
margin-top: 44px;
margin-right: 20px;
color: #FFFFFF;
}

header #menu li {
display: inline;
margin-left: 15px;
}


/* Media Queries */
@media screen and (max-width: 480px) {

#menu-img {
visibility: hidden;;
}

header #menu {
visibility: visible;
display: block;
float: left;
}

header #menu, #main100, #main60, #submain35, #footer {
float: left;
clear: left;
margin: 0 4px 0 4px; 
width: 95%;
}	

header #menu li {
margin: 0;
background: #850d67;
display: block;
margin-bottom: 3px;
}

header #menu a {
display: block;
padding: 10px;
text-align: right;
}		

}
 

dukeilduca

Nuovo Utente
5 Feb 2008
8
0
0
Ciao, ti ringrazio per la risposta ma non è quello il problema.
Infatti il div #menu è già alto giusto in quanto vedo che si vedono tutte le voci, solo che l'immagine che fa passare le 4 immagini rimane sopra al menu, mentre dovrebbe abbassarsi e posiziionarsi appena sotto...
 
Discussioni simili
Autore Titolo Forum Risposte Data
D Problema con sovrapposizione DIV HTML e CSS 2
P Problema sovrapposizione di css HTML e CSS 1
max_400 Gioco di auto - Problema sovrapposizione clip - by max_400 Flash 0
max_400 Problema Sovrapposizione di Oggetti: Flash 0
T PROBLEMA CON SESSIONI PHP 3
A Problema, non so, di scale() o transform, oppure altro? HTML e CSS 0
T ALTRO PROBLEMA CON ARRAY PHP PHP 1
T PROBLEMA CON ARRAY PHP 8
L problema con query select PHP 2
R Problema query con ricerca id numerico PHP 2
F Problema con risposta PHP 0
S problema con recupero dati tabella mysql PHP 2
Z Problema con il mio tp-l i nk Reti LAN e Wireless 1
I PROBLEMA: Sostituzione sito XAMPP E-Commerce 0
T problema data 30/11/-1 PHP 0
L Problema RAM con Tomcat 8 Apache 0
napuleone problema con sort e asort PHP 4
Y Problema incolonnamento tabella PHP 7
S problema salvataggio immagini Photoshop 0
Z Problema con INT MySQL PHP 1
Z Problema database MySQL con XAMPP PHP 0
M Problema con controllo form in real time jQuery 6
D problema php mysql PHP 1
D problema php mysql PHP 1
M Problema Wi-Fi Linux Linux e Software 0
Z Problema di sincronizzazione PAYPAL con PHP PHP 1
Daniele_Carrara Problema Aperture Mailup Email Marketing 5
F PROBLEMA ACCESSO INSTAGRAM Discussioni Varie 2
R Problema connessione db PHP 7
M problema if PHP 2
G Problema con Get page PHP 4
N Problema passaggio variabili tra pagine PHP 4
P Problema con require once PHP 6
P Problema con i package Java 1
A Problema login con Safari PHP 14
F INDESIGN: problema esportazione esecutivo per la stampa con foto B/N Webdesign e Grafica 1
H problema carrello woocommerce PHP 2
S problema con css bootstrap3 HTML e CSS 4
M .load() problema con caricamenti dinamici di js Javascript 0
M Problema su query JOIN in tre tabelle PHP 0
S Problema esportazione tabelle Mysql in Excel PHP 0
G Problema ------- con Query PHP 1
G Problema con Query PHP 1
M Problema su update di 3 tabelle PHP 1
T problema con select dinamica con jquery Javascript 0
A Problema checkout carrello php PHP 2
R Problema al server Domini 0
A Problema nel passare la variabile PHP 0
G Problema update di un database PHP 0
S Problema con spazi bianchi HTML e CSS 4

Discussioni simili