4.4.14

Blog design: come centrare la data e il titolo di un post

4.4.14 15 Commenti
Certo questo tutorial non è in cima ai tutorials richiestimi, ma per realizzare quello delle pagine fisse in alto devo fare anche un video tutorial, perchè lo sapete ormai... mi piace semplificarvi la vita ;)

Quindi vediamo come centrare la data il titolo del post.
Niente di più semplice!

LA DATA


Cercate negli stili del vostro blog il blocco riguardante la data che trovate sotto il nome di .date-header span.
Probabilmente troverete l'allineamento del testo a sinistra, ovvero text-align:left, voi dovete dargli il comando di centrarlo, quindi sostituite left, con center.
Se invece non lo trovate, perchè non c'è scritto, inseritelo voi, come nell'immagine qui sotto.

Come avrete notato nell'immagine, un'altra riga ho evidenziato perchè importante, ovvero display:block.
Cosa sta a significare?


Con questo comando gli diciamo che l'elemento inserito nella pagina html, deve occupare tutta la riga, per intero, senza intereferenza da parte di nessun altro elemento.
In pratica su quella riga ci deve stare solo lui ;)
Quindi, anche questo aggiungetelo!

IL TITOLO DEL POST


La stessa cosa succede per il titolo del post.

Se doveste avere problemi, potete sempre lasciare un commento.
Spero vi sia utile :)

15 commenti:

  1. Wow, grazie!! Non ci avevo mai pensato, ma con i titoli così il mio blog è ancora più bello! c:
    Prometto che, quando avrò fatto tutte le modifiche del caso al mio blog, ti dedicherò un grazie ufficiale in un post! (:

    RispondiElimina
  2. Grazie, queste istruzioni sono molto utili. Da poco mi gingillo con i codici html, e devo dire che qualche volta mi danno soddisfazione ;) Ciao.

    RispondiElimina
  3. Grazie Simona, appena fatto!
    Ho seguito le tue istruzioni ed è stato un gioco da ragazzi!
    Sei sempre un valido aiuto ed un punto di riferimento per i nostro blog.
    Buon fine settimana e ancora grazie.
    Emanuela

    RispondiElimina
  4. Centrare è una cosa che mi interessa molto ma non ci riesco mai nel mio blog infatti tutto va per conto suo.....proverò a seguire le tue istruzioni incrocio le dita che sia la volta buona!!!!!

    RispondiElimina
  5. Il titolo dei post centrato è una cosa che non sempre mi piace, dipende moltissimo da tutto il resto del layout. Nel tuo blog sta benissimo! Nel mio, al momento, credo che stonerebbe.
    Simona, nel weekend ho sentito che c'è stata una forte scossa di terremoto nel Crotonese... Tutto a posto, vero?

    RispondiElimina
    Risposte
    1. Sì, Silvia il terremoto è stato del 5 grado, fortunatamente è stato molto in profondità nel mare, quindi non si è sentito molto, che se penso al rombo del terremoto che ho sentito una notte di qualche anno fa mi vengono ancora i brividi -.-

      Elimina
    2. Brutto spavento, immagino :(
      A me è capitato un anno che ero in vacanza sul Gargano: l'epicentro era un po' più distante rispetto al vostro, ma non dimenticherò mai quel rombo lunghissimo che mi ha svegliata e poi il terrore degli animali tutt'attorno...
      Sono contenta di sapere che non avete avuto danni!

      Elimina
  6. ciao Simo! utilissima quest'idea! grazie :)
    Ma mi sai dire perchè la mia data è tutta in maiuscolo? io non l'ho mai settata così.
    E' stata sempre maiuscolo.
    Ma vedo che negli altri blog è in minuscolo (e a me piacerebbe minuscolo).
    Baciuzzi e buona Pasqua!
    germana

    RispondiElimina
    Risposte
    1. Ciao Germana! E' in maiuscolo perchè è impostato da un codice che ho visto essere presente nel tuo CSS...per ovviare a questo problema entra nel tuo codice e, premendo i tasti CTRL+F, cerca il blocco h2, ti si presenterà così:
      /* Headings
      ----------------------------------------------- */
      h2 {
      margin: 0 0 1em 0;
      font: normal normal 12px Molengo;
      color: #990000;
      text-transform: uppercase;
      }
      Devi eliminare text-transform: uppercase;

      Elimina
    2. non si vedono, erano emoticon con cuoricini!
      baciuzzi,
      g.

      Elimina
    3. ahahahahah grazie lo stesso, apprezzo comunque :D ♥♥♥

      Elimina
  7. Care blogger, ho un'informazione da chiedervi: spesso i titoli dei post sono un po lunghi e occupano 2 righi a causa della dimensione della scrittura e del fatto che ho usato un layout a tre colonne. Mi chiedo se è possibile e, se lo è, come posso fare per modificare il titolo di un post e dividerlo tra le due righe in modo equo e più elegante, tipo così:
    Cosi si presenta il mio blog:
    Recensione: "Scommettiamo che ti faccio
    innamorare" di Emma Hart
    Mentre vorrei:
    Recensione:
    "Scommettiamo che ti faccio innamorare"
    Emma Hart
    TUTTO CENTRATO.

    RispondiElimina
    Risposte
    1. Ciao cara :)
      Allora, ho capito cosa intendi. Ho notato che l'ultimo titolo ti è venuto come lo volevi tu, ma gli altri no... Dunque un codice vero e proprio da incorporare nel tuo CSS non c'è, e questo è un problema perchè come saprai il CSS fa sì che tutti gli elementi simili, presenti nel tuo blog, vengano modificati contemporaneamente...
      Invece, in questo caso, devi andare ad agire sul titolo di ogni post: in pratica devi dargli il 'comando' di andare a capo!
      Ti basta scrivere <br/> subito prima della parola che deve andare a capo e il gioco è fatto ;)
      Se mi son sbagliata dimmelo pure :*

      Elimina

buzzoole code
Copyright © La Creative Room.