[CSS] Stranezza margin e tag p

Ciao a tutti ragaSSuoli del foro (detto così pare il titolo di un porno =! )
ovviamente sto ancora impicciato con i CSS, tanto che mi è capitata una cosa davvero singolare: la situazione è questa.

Ho due blocchi, un menu a sinistra ed uno per il contenuto a destra. Il testo che includo nel blocco per i contenuti sta lì, ma se cerco di muoverlo con il margin dal bordo sinistro del blocco non si muove di un millimetro. Ho provato a distanziarlo di x pixel + la larghezza del blocco del menu e si sposta come dovrebbe :shock: Possibile che mi calcoli il margin dall'inizio del blocco di sinistra?

La situazione potete vederla su http://mksoftware.altervista/test - Date un'occhiata ai css e vedrete che il tag p nel blocco cont è settato per avere margin left di 162px (per distanziarlo di 10px dal bordo del blocco cont) :mrgreen:

La domanda non è come... la domanda è... PECCHÉ :mrgreen:

perchè probabilmente hai usato float left per il blocco menù e quindi lo hai sradicato dal flusso normale.

Citazione:

---

Originalmente inviato da acsocmel

perchè probabilmente hai usato float left per il blocco menù e quindi lo hai sradicato dal flusso normale.

---

Uhm ok quindi è una cosa normale quella che mi succede? É corretto quello che ho fatto o è una "porcata" per farlo funzionare? Ovviamente come hai detto tu utilizzo il float:left per il menu di sinistra :mrgreen:

Io non ho posso raggiungere il tuo sito, dice che non esiste.

Comunque fai così, io uso questo codice per fare dei layout a due/tre colonne.

Codice HTML:

---

<div class="column left">
        <span>Contenuto colonna sinistra</spon>
</div>
<div class="column center">
        <span>Contenuto centrale</span>
</div>
<br clear="all" />

---

Questo è il css:

Codice:

---

div.column {
        padding: 5px;
}

div.column.left {
        float: left;
        margin-right: 5px;
        width: 180px;
}

div.column.center {
        overflow: hidden;
        width: auto !important;
}

---

Se lo vuoi a tre colonne invece:

Codice HTML:

---

<div class="column left">
        <span>Contenuto colonna sinistra</spon>
</div>
<div class="column right">
        <span>Contenuto colonna destra</spon>
</div>
<div class="column center">
        <span>Contenuto centrale</span>
</div>
<br clear="all" />

---

Codice:

---

div.column {
        padding: 5px;
}

div.column.left {
        float: left;
        margin-right: 5px;
        width: 180px;
}

div.column.right {
        float: right;
        margin-left: 5px;
        width: 180px;
}


div.column.center {
        overflow: hidden;
        width: auto !important;
}

---

se vuoi che a destra ci sia un margine uguale alla larghezza del tuo menù di sinistra
hai fatto bene, è un metodo simpatico che mi ha suggerito una soluzione per un mio problema :-)
se invece vuoi che il testo riempa tuttpo lo spazio
devi togliere le dimensioni a #cont e lasciare il margin a <p>
oppure
lasciare le dimensioni a #cont e dargli lo stesso margin che dai a <p> e lo togli da <p>

Con la soluzione postata da me, non dovrai fare nessun calcolo per il margine del blocco non flottante, sarà tutto automatico acsomel :wink:

Citazione:

---

Originalmente inviato da biccheddu

Con la soluzione postata da me, non dovrai fare nessun calcolo per il margine del blocco non flottante, sarà tutto automatico acsomel :wink:

---

io dico che non funziona :roll:

E allora dici male :lol:

Credi che non lo provi? Entra nel mio sito (quello nel profilo) e guarda il sorgente e il css, ti accorgerai che funziona. La home è tableless ed utilizza il codice postato.

conosco il tuo sito, mi piace pure
ma quello che hai scritto in questo post è sbagliato e non può funzionare
comunque fai finta che non ho detto niente :oops:

Grazie Bic, ma se il layout è corretto preferisco lasciare quello scritto da me :mrgreen: In ogni caso fa sempre comodo avere qualcosa di già scritto, specialmente quando con queste cose ci lavori quindi grazie ancora. Il link non funziona perchè manca il .org dpo altervista :P Puoi vederlo su http://mksoftware.altervista.org/test/index.php

Grazie anche a te acsomel, se come dici è un metodo per risolvere il problema, allora lascio tutto così :wink:

attento che ho detto che risolveva un mio problema
tu devi provare a riempire di testo e vedere il comportamento
se devo dirla tutta dovresti prima scivere i contenuti e poi aggiustarli con i css
ma il mondo si sa che va alla rovescia :twisted:

Citazione:

---

Originalmente inviato da acsocmel

ma il mondo si sa che va alla rovescia :twisted:

---

Non dirmelo, mi hanno commissionasto questo lavoro ed ancora devono consegnarmi 3/4 dei contenuti :???:

Non è giusto quello che fai, perchè metti un margin quando non è utile inserirlo.

Se fai come ti ho scritto, tutto sarà ridimensionato in baso al div flottante, che nel tuo casò contiene il menù, capito?

Poi fai come vuoi, fatto sta che se un giorno dovrai modificare/agiornare dovrai mettere mano a più proprietà nel css e fare calcoli per distanziare il contenuto.

Ehi Bic
volevo segnalarti che, pur usando il tuo layout, mi sono accorto che il problema mi si presenta comunque =D I margin non me li prende manco se picchio il pc con un mazzuolo, addirittura le liste me le butta sopra ad un pezzetto d'immagine ( http://mksoftware.altervista.org/tes...pg=guida&ln=pl ). Inoltre dopo il menu il testo (o qualsiasi altro contenuto) mi si butta sotto al blocco menu... Insomma è un bel pasticcio :S