Visualizzazione dei risultati da 1 a 9 su 9
  1. #1

    Allineare parole di dimensione diversa

    Buongiorno a tutti,
    Provo a spiegare il mio problema in lato chiaro. Sto lavorando in HTML (ovviamente) e ho un problema a definire il titolo del mio sito. Vorrei scrivere tre parole di dimensione diversa. Esempio:

    Stefani & Gasperini

    Ho provato sfruttando sia i div che gli h1 - h3 ma il mio risultato è:

    Stefani
    &
    Gasperini
    Esiste un modo, che voi sappiate, affinché possa scrivere un testo sulla stessa linea per cui le parole abbiano dimensione diversa? Grazie per l'aiuto. Spero di essermi spiegata al meglio
    Ultima modifica di chicca1994; 31-05-2017 a 14:52

  2. #2
    codice:
    <h1>Stefani <span class="small_text">&</span> Gasperini</h1>
    
    <style type="text/css">
    h1{ font-size:25px }
    .small_text{ font-size:15px }
    </style>


    Visto che si tratta del titolo del sito, ho usato il tag h1.
    Ho racchiuso parte del testo (la e commerciale) in un tag span (che di default ha un display inline, cioè non inizia una nuova riga) ed ho assegnato al tag "span" la classe "small_text".
    Quindi ho impostato, via CSS, una dimensione del carattere di 25 pixel per il tag h1 ed una dimensione di 15 pixel per il testo contenuto nel tag span con classe small_text.

    Nel mio esempio ho usato un solo span, per marcare un'unica porzione di testo ma avrei potuto utilizzarne diversi applicando a ciascuno la classe small_text o definendo altre classi per dimensioni diverse.
    Ultima modifica di lucavizzi; 31-05-2017 a 15:05

  3. #3
    http://imgur.com/a/F4Fwm
    Copiando il tuo codice mi torna comunque lo stesso problema...

  4. #4
    Dall'immagine che hai postato direi che stai usando una dimensione del carattere troppo grande e lo spazio a disposizione del testo è troppo angusto.

    Usa un font-size minore se vuoi che il testo si disponga su una sola riga anche alle basse risoluzioni.

  5. #5
    Corretto ma possibile che se invece uso solo h1 con carattere (paradossale) di 72px il testo entri comunque?

  6. #6
    Come ho scritto precedentemente, il tag span, di default, ha un display:inline e non "manda a capo" il testo.
    (Potrebbe però anche essere (anche se è improbabile), che in qualche regola css, venga impostato un display:block per gli elementi "figli" dell'h1.)

    Quindi l'unico fattore determinante il ritorno o non ritorno a capo dovrebbe essere il font-size.

    Volendo potresti impostare un white-space:nowrap sul tag h1 per impedire "a prescindere" un ritorno a capo, con questa regola però rischi che il testo "esca fuori dal monitor" alle basse risoluzioni.

    Se hai un link dove è possibile vedere questo h1, postalo pure.

  7. #7
    Purtroppo sto lavorando in localhost. Provo subito il consiglio che mi hai dato

  8. #8
    Nulla. Controllato tutti i "figli" di h1 ma nessuno ha il display che compromette e in aggiunta ho provato a ridurre il carattere ma non funziona lo stesso...

  9. #9
    Guarda. Ho risolto brutalmente inserendo l'inline nel codice CSS ahah Ti ringrazio tantissimo per i consigli. Si può anche chiudere la discussione

  10. #10
    IT is very informative post.thanks for sharing.

    web designing company in Hyderabad

Tag per questa discussione

Permessi di invio

  • Non puoi inserire discussioni
  • Non puoi inserire repliche
  • Non puoi inserire allegati
  • Non puoi modificare i tuoi messaggi
  •  
Powered by vBulletin® Version 4.2.1
Copyright © 2024 vBulletin Solutions, Inc. All rights reserved.