Primo Layout Elastico

danlupo

Utente Attivo
13 Lug 2009
73
0
0
Primo Layout Elastico
Salve, sto sperimentando per la prima volta un layout elastico ma non devo aver capito bene come funziona ?? :confused:

  • Ho un margine superiore che non mi sembra di aver impostato
  • Ho uno shift verso il basso del div content con relativo shift del footer
  • * Ho dovuto impostare un'altezza di 51.92em su un'altezza massima di 64 em anche se penso sia dovuto alla presenza delle barre degli strumenti di FF

Allego l'immagine del "risultato" ed i codici del file CSS e del file HTML

Codice:
body
{
    font-size: 1em;
    padding: 0;
    margin: 0 auto;
}

html
{
    font-size:100%;
}
div#c
{
    margin: 0 auto;
    height:51.92em;
    width:80em;
    background-color:#4682b4;
}
div#h
{
    margin:0 auto;
    height:7.788em;
    width:80em;
    background-color:red;
    padding:0;
}
div#n
{
    float:left;
    margin:0 auto;
    height:41.536em;
    width:12em;
    background-color:white;
    padding:0;
    margin:0 auto;
}
div#e
{
    float:right;
    margin:0 auto;
    height:41.536em;
    width:12em;
    background-color:yellow;
    padding:0;
    margin:0 auto;
}
div#b
{
    margin:0 auto;
    height:41.536em;
    width:56em;
    background-color:tan;
    padding:0;
    margin:0 auto;
}
div#f
{
    clear:both;
    margin:0 auto;
    height:2.596em;
    width:80em;
    background-color:green;
    padding:0;
}

Codice:
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN">
<html lang="en">
<head>
    <title><!-- Insert your title here --></title>
    <link rel="stylesheet" type="text/css" href="prova.css">
</head>
<body>
    <div id="c">
        <div id="h">
            <h1>CIAO</h1>
        </div>
        <div id="n">
            <ul>
                <li>pippo</li>
                <li>pippo</li>
                <li>pippo</li>
                <li>pippo</li>
                <li>pippo</li>
            </ul>
        </div>
        <div id="e">
            <ul>
                <li>pippo</li>
                <li>pippo</li>
                <li>pippo</li>
                <li>pippo</li>
                <li>pippo</li>
            </ul>
        </div>
        <div id="b">
            <p> Questo è un testo di prova</p>
        </div>
        <div id="f">
            @Email
        </div>
    </div>
</body>
</html>
problemas.jpg



Chiedo Comprensione per l'ignoranza manifesta :mad:

Grazie per le spiegazioni e consigli, Daniele
 

Trogo

Utente Attivo
11 Gen 2008
370
0
0
43
Sanremo
Il problema dello spostamento verso il basso è colpa del tag H1. Prova a fornirgli uno stile dando margin-top: 0px
 

danlupo

Utente Attivo
13 Lug 2009
73
0
0
Mi da lo stesso risultato !! :confused:

Ma risolto con Margin 0 anche nel P
 
Ultima modifica:
Discussioni simili
Autore Titolo Forum Risposte Data
spider81man Eliminare primo ed ultimo carattere di una colonna MySQL 0
M Esportazione in CSV, salta il primo record PHP 4
felino [JQuery] Append dopo ultimo ul li del primo livello jQuery 2
R Primo script in PHP / CSS PHP 4
E [Offro] Realizzazione di siti web e ottimizzazione SEO per raggiungere il primo posto su Google Offerte e Richieste di Lavoro e/o Collaborazione 0
MarkRed Come indicare, in una maschera, il primo controllo d'input, tipo "SetFocus" jQuery 9
C [ Vendo ] Dominio di primo livello Compravendita siti e domini 0
N [Photoshop] Tavoletta Grafica XP-Pen O Wacom : Consigli per il primo Acquisto Photoshop 0
I [HTML/CSS] Consigli sul mio primo sito HTML e CSS 9
Cloud Register.it Partner Prova i VPS Register.it : Il primo mese sconti fino al 50% su tutte le configurazioni Server Dedicati e VPS 0
A Primo lavoro realizzazione sito Leggi, Normative e Fisco 0
W [PHP] Un aiuto per il mio primo "Multithread" PHP 0
A [PHP] COMBO LOAD PRIMO CAMPO VUOTO PHP 2
A [Javascript] La larghezza del video player, diminuisce nel passaggio dal primo video ai successivi Javascript 0
ecosito Mailchimp: copiare l'email inserita nel form html nel primo campo del form di Mailchimp HTML e CSS 4
P Includere file php in altro file php, evitando l'html del primo... PHP 0
L Div in primo piano e resto opaco Javascript 1
Gabriele Visioli Hosting 1&1 a 1 € per il primo anno Hosting 2
D Problemi di stampa primo record ciclo WHILE PHP 2
L Inserisco 2 menù e vedo sempre il primo PHP 0
StarFish Ubuntu ONE chiude il primo Giugno 2014 Linux e Software 0
ypsilon86 Il mio primo sito! Presenta il tuo Sito 4
M Il mio primo sito. Aiuto Webdesign e Grafica 3
L codifica utf-8 e primo sito web aiuto PHP 0
P Primo approccio con mysqli PHP 6
P Mancata estensione background-repeat sul resto della pagina oltre il primo div e/o prima tabella HTML e CSS 2
M Cosa ne pensate del mio primo file PHP (verifica disponibilità stanze)? PHP 0
A Sitopiupiu.it: Primo Censimento delle Directories Italiane Offerte e Richieste di scambio links 0
C [RISOLTO] Problema somma td, prende solo il primo valore jQuery 7
F Problemi con il mio primo sito, galleria fai da te non visualizzata correttamente HTML e CSS 1
montim Primo post Presentati al Forum 1
M codice js che non funziona al primo clik Javascript 3
C Ordinare alfabeticamente un array e ordinare un secondo array in funzione del primo. Javascript 12
N Primo accesso area riservata PHP 1
Eruyomon Il mio primo sito Presenta il tuo Sito 25
P come inserire in un database un dato e farlo andare come primo dato messo PHP 23
R Qualche consiglio per il mio primo sito in PHP? Presenta il tuo Sito 5
I Il nostro primo sito: cosa ne pensate? Presenta il tuo Sito 6
C mio primo sito HTML e CSS 3
V Giudicate il mio primo lavoro Presenta il tuo Sito 2
max_400 Un pò di storia?....Il primo mouse Discussioni Varie 2
M costruzione primo forum PHP 3
C Codice html per ottenere finestre in primo piano fisse e a scatta sovrapposte HTML e CSS 35
M Primo approccio VB.NET + SQL ASP.NET 1
S Novello in PHP - primo problema PHP 4
N Flattr - Il primo Micro Social Payment Guadagnare col Sito 0
K Primo sito online per kentatonika!!!! Presenta il tuo Sito 4
M Come far lavorare uno script solo al primo accesso... Javascript 3
L Il mio primo sito in joomla Presenta il tuo Sito 2
puffobiondo Chiedeo consigli per il mio primo sito Discussioni Varie 6

Discussioni simili