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

    Problema con max-width e text-align in Gecko

    Ho il seguente codice XHTML:
    codice:
    			<ul id="sections-nt">
    
    				[*]<span>Informatica</span>
    				[*]<span>Fotografia</span>
    				[*]<span>Telefonia</span>
    			[/list]
    (span è inutile, è solo una prova) a cui applico il seguente CSS per farlo apparire come un dock orizzontale di icone:

    codice:
    #dock-nt ul li {
    float: left;
    padding-left: 5px;
    padding-right: 5px;
    }
    
    #dock-nt ul li a {
    min-width: 75px;
    display: block;
    padding-bottom: 93px;
    color: white; /* #c8f8ff; */
    text-align: center;
    /*font-family: Georgia, "Times New Roman", serif;*/
    font-size: x-small;
    background-repeat: no-repeat;
    background-position: bottom center;
    }
    (le icone, cioè gli sfondi di A, li applico poi ai singoli ID).
    Il problema è che se uso min-width: 75px, text-align: center non viene applicato nei browser basati su Gecko (mentre ad esempio su khtml e opera funziona).
    Per vedere il codice "in azione", andate qui: http://techlog.netsons.org/ (ancora il CSS è in costruzione, il tema su IE da' problemi).

    Lasciando min-width (serve, in combinazione con display: auto dell'header, a non rovinare completamente il layout in caso di ridimensionamento dei caratteri), sapete come risolvere?

  2. #2
    Utente di HTML.it L'avatar di oskaron
    Registrato dal
    Sep 2006
    Messaggi
    344
    mhm, su firefox a me sembra funzionare

  3. #3
    Originariamente inviato da oskaron
    mhm, su firefox a me sembra funzionare
    Strano, ho provato su Windows, Mac e Linux e ho sempre lo stesso problema.
    Comunque, questa è la resa ottimale (screenshot di konqueror - ma si ottiene la stessa resa con safari):

    Questa invece è la resa sbagliata, su Firefox e altri browser basati su gecko:

    (l'errore è evidente su "guide", che ha un "titolo" breve).
    Ho provato a mettere il titolo dentro <span>, renderlo un blocco e facendogli occupare lo spazio di <a>, e infine rendere il suo testo centrato, ma non cambia nulla.
    La cosa buffa è che se sostituisco
    codice:
    min-width: 75px;
    con
    codice:
    width: 75px;
    l'allineamento funziona (senza nemmeno sporcare il codice con gli <span>), ma vorrei lasciare solo la larghezza minima, in modo che se il testo si ingrandisse, si muovano le icone sul dock e i titoli non si sovrappongano.

  4. #4
    Utente di HTML.it L'avatar di oskaron
    Registrato dal
    Sep 2006
    Messaggi
    344
    non so se tu abbia aggiornato, ma a me i menu son centrati, e sto usando firefox su linux. Non credo comunque sia una cosa imputabile ai browser gecko, nel senso che secondo me non dovresti sbatterci troppo la testa su quello.

  5. #5
    Adesso sono centrati perché per il momento ho sostituito min-width con width espresso in em (non è propriamente la soluzione ottimale, anche se è quella che più si avvicina a min-width - varia la sua larghezza al variare della dimensione del testo).
    Appena ho tempo faccio delle prove con dei file html e css semplici, per vedere se il problema dipende in qualche modo dal template di wordpress

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 © 2025 vBulletin Solutions, Inc. All rights reserved.