• User

    Problemi con sidebar

    Salve a tutti, vorrei modificare le dimensioni della sidebar del mio sito, ma proprio non riesco. Il sito in questione è fareletteratura punto it. Riporto la parte di codice relativa alla sidebar:

    /**************** Sidebar *********************/
    #subscribe{height:35px;} a{color:#6e9193; font-size:13px; text-transform:uppercase; float:left; text-decoration:underline;}
    #rss{ margin:0 10px 0 0;}
    #ls{background:url(images/serach.gif); width:214px; height:26px; float:left; border:0; font-family:Georgia, "Times New Roman", Times, serif; font-size:16px; padding:5px 5px 0 5px; color:#777;}
    #submit{float:left;}
    #sidebar{padding:20px 0 0 0;} ul, ul ul{list-style:none;} ul li h2{font-size:20px; font-family:Arial, Helvetica, sans-serif; color:#333; border-bottom:1px dotted #333; padding:0 0 5px 0; margin:0 0 7px 0;} ul li ul{margin:0 0 20px 0;} ul li ul li a{color:#6e9292; font-size:14px; text-decoration:none; line-height:25px;} ul li ul li a:hover {color:#666666; background:url(images/tags.gif) right no-repeat; padding-right:22px;}
    

    Ho provato ad agire su{padding:20px 0 0 0;} inserendo il tag width ma senza ottenere i risultati sperati.
    Spero qualcuno mi voglia aiutare, grazie.


  • Moderatore

    Ciao Dr.Strangelove,
    questo tipo di domande sarebbe più corretto farle nella sezione dedicata ai CSS, perchè l'argomento non è strettamente collegato a WordPress.

    Comunque, ho dato uno sguardo veloce al tuo sito, dovresti modificare la larghezza (width) al seguente elemento del tuo foglio di stile:

    #c2 {
    float: right;
    padding: 5px 12px 0 17px;
    width: 253px;

    }

    Lo trovi alla riga 15 del tuo CSS.

    Ovviamente, se allarghi la sidebar devi stringere la colonna principale, per fare questo, prova a modificare la larghezza del seguente elemento:

    #c1 {
    float: left;
    padding: 18px 15px 0 20px;
    width: 551px;

    }

    Riga 14.

    Fammi sapere. 🙂


  • User

    Hai ragione, perdonami, se desideri spostare fai pure. Innanzitutto ti ringrazio per la risposta; ho provato ad effettuare delle modifiche a quella parte del CSS ma senza ottenere risultati.

    Modificando width in
    #c2{float:right; width:280px; padding:10px 12px 0 17px;}

    l'unico risultato che ottengo è che si sposta verso sinistra tutto il "menù" della sidebar, ma senza aumentare le dimensioni della stessa.

    Modificando invece in
    #c1{width:551px; float:left; padding:18px 15px 0 20px;}

    non ottengo nessun risultato visibile...

    *Ho notato come se ci siano due livelli. Uno invisibile che contiene i contenuti, che è quello che si modifica, mentre quello delle colonne non si sposta d'una virgola. Per intenderci meglio, mostro uno screen dopo aver fatto le dovute modifiche nei due campi width:
    *
    img689.imageshack.us/img689/7417/screenx.gif
    *


  • Moderatore

    Dallo screenshot sembra che si sia allargata la sidebar e che si sia ristretta l'altra colonna. Quindi credo che vada bene così.

    Ti manca solo di modificare l'immagine di sfondo del wrapper per aumentare il grigio scuro che va sotto la sidebar.

    Trovi il richiamo a quest'immagine a riga 13 del css:

    #wrapper {
    background: url("/images/wrapper.gif") repeat-y scroll 0 0 transparent;
    float: left;
    padding: 0 0 10px;
    width: 872px;
    }

    Salva questa gif (/wp-content/themes/simplepaper/simple%20paper/images/wrapper.gif) ed aumenta la porzione di grigio scuro presente sul lato destro dell'immagine fino a raggiungere i 280px.


  • User

    Ti ringrazio molto giapox, pensavo di dover toccare esclusivamente il codice ed ho ignorato ingenuamente quella .gif.

    Grazie ancora per il tuo prezioso aiuto.


  • Moderatore

    @Dr.Strangelove said:

    Grazie ancora per il tuo prezioso aiuto.

    E' stato un piacere. 🙂