menu verticale e div affiancati

tykos

menu verticale e div affiancati

Ciao a tutti, ho creato una pagina per visualizzare delle cucciolate di un allevamento.
la struttura è la seguente:
-colonna sx, dove sono riportate le "generalità" della cucciolata (solo testo)

paginona centrale, con una galleria di foto

cliccando sulla colonna sx, si apre la gallery della cucciolata corrispondente, allo stesso tempo vengono evidenziati il box della cucciolata e quello della gallery con un colore più scuro.
E questo funziona.

Adesso è così:
img262.imageshack.us/my.php?image=comhf3.jpg

Quello che non mi convince è:

lo stacco di colore: vorrei farli continui, come nella seconda immagine( img404.imageshack.us/my.php?image=comedeveessereew3.jpg )
non riesco a separare le scritte dal bordo: vengono appiccicate e si leggono male. Ho giocato con i padding e i margin, ma si sposta anche il background colorato...

ah, ogni commento/suggerimento sulla resa grafica è ben accetto!

grazie mille!
Michele

karedas

Ciao Tykos

Puoi darci una fonte online compresa di codice html/css come appunto un link in modo da aiutarti al meglio?

Attualmente così rischiamo solo di sparare nel buio, i fattori potrebbero essere molteplici

SSciao!

tykos

@karedas said:

Puoi darci una fonte online compresa di codice html/css come appunto un link in modo da aiutarti al meglio?

[mammamia]
intanto sono un pirla, la gallery era flottante a destra. L'ho messa a sx e i colori sono uniti.
Pure i padding sono andati a posto, sempre perchè sono un pirla, intendiamoci.

tanto per dare un senso a questo thread posto i codici che ho usato, chissà mai che servano a qualcuno...

non ho un link, perchè sto sviluppando in locale e portare tutto su un remoto provvisorio è una complicazione (anche perchè netsons non funziona con la versione di gallery2 che uso io...).

provo a spiegare il css:
Ho un contenitore generale, largo 90% della pagina.
All'interno del contenitore (tralasciando header, footer, razzi e mazzi) ho un div, chiamato dispcuccioli, che comprende tutta la colonna di sx e ha questo codice:

.dispcuccioli{
    width: 29%;
    float:left; 
    padding: 1.3em 0 1.3em 1em;
    background:#f4ffe4;
    font: normal 1.1em/1.2em Verdana, Tahoma, Arial, SansSerif;
}
```Ogni cucciolata ha un suo boxino, chiamato nomicucciolate e ordinato come una lista, con ul/li:

.nomicucciolate{
width: 99%;
float:left;
padding: 10px 50px;
background:#f4ffe4;
font: normal 1em/1.2em Verdana, Tahoma, Arial, SansSerif;
}

.fotocucciolate{
width: 66%;
float:left;
background: #8cb85c;
}