Float, display, inline...not so CLEAR!

[Richard81]

Buosare ragazzi sono un newbie.
Ho letto alcune guide e analizzato alcuni esempi sul funzionamento dei css per il posizionamento dei div.
In questo sito:
http://cat.lucapiergentili.it

Vorrei mettere i field su un'unica riga con i corrispettivi label.
Seguendo questo sito
http://learnlayout.com/inline-block.html
ho provato sia a mettere il float left ad entrambi gli elementi e ho commentato il clear:both.
Poi ho anche provato a mettere display:inline ma senza successo.
Sono solo riuscito a posizionarle di fianco togliendo display:block alle label e width: 50% ai field,
ma rimango cmq su due linee distinte.
Qualche suggerimento?
Grazie infinite, ho provato a trovare la soluzione autonomamente ma ancora è presto!
Grazie ancora!

Cris

[carlomarangoni]

Forse serve vedere il codice della pagina ancora meglio la pagina online

[Richard81]

La pagina è online! Ho pensato sia più facile analizzare l'elemento da lì per quello non ho postato il codice!

[panagulis72]

Ciao, la soluzione del float:left è quella esatta, ma bisogna stare attenti a quale classe attribuirla. Ecco la mia soluzione:

scroll.jpg

[panagulis72]

Ciao, la soluzione del float:left è quella esatta, ma bisogna stare attenti a quale classe attribuirla. Ecco la mia soluzione:

http://s30.postimg.org/w2l9yntz5/scroll.png

[Richard81]

Grazie mille per la risposta. Nel frattempo ho spostato il sito qui

http://50.87.248.234/~placehx2/

Visto che sembra che tu te ne entenda, vorrei che il menu fosse sempre in mobile style, come quando la pagina è sotto i 992px.
Come posso farlo apparire anche nelle risoluzioni maggiori?
Ho provato a cambiare il display:none nel css sotto media=all ma mi viene fuori solamente il bottone in una posizione alquanto scomoda, ma nessuna delle voci del menu.
Su quale file devo intervenire?
Grazie infinite!

[panagulis72]

Se ho capito bene la richiesta, la soluzione è molto semplice.
Per otterene l'effetto desiderato devi operare sul foglio di stile chiamato 'theme-responsive.css'. Nella sesta riga hai questa regola: @media (max-width: 991px), la quale ordina al browser di visualizzare il pulsante-menù ridotto quando scendi sotto i 992px. Modificandola, per esempio, con min-width si otterrà questo risultato, che è l'inverso dello stato attuale:
http://s4.postimg.org/xevdhrg0t/image.png

Potresti cancellare l'imposizione di max-width, oppure inserire quella regola nel foglio di stile principale. Molti modi, unico risultato.

P.S. il concetto e la posizione all'interno del foglio di stile 'theme-responsive' sono uguali e valide anche il nuovo allocamento del sito

[Richard81]

Grazie mille, mi hai salvato! La questione è perché chrome non mi da il file theme-responsive.css come a te fra i fogli di stile, mi mostra solamente theme.css e responsive.css, nei quali non riuscivo a modificare le direttive come hai fatto tu...
Installando firebug per chrome ottengo lo stesso risultato tranne per una voce in fondo che mi dice "The results here may be inaccurate because some stylesheets could not be loaded due to access restrictions". Sembra che se il foglio di stile all'interno della pagina sia puntato ad una url assoluta, non venga mostrato dalla finestra di sviluppo...
Ma si può lavorare così???

[panagulis72]

In Firefox sono andato sulla sezione 'Editor Stili' per avere la lista completa dei .css come in figura.
Ti ricordo inoltre che le modifiche fatte tramite l'analisi della pagina sono temporanee e locali. Al momento di ricaricare la pagina le impostazioni tornano come prima. Quindi devi aprire nel tuo computer il file theme-responsive.css con un editor di testo, modificare a tuo piacimento il codice, hostarlo e sovrascrivere il file attuale.

[Richard81]

Neanche il finder su Mavericks mi cercava dentro a quel file, sembra che il finder non cerchi dentro i css, ora ho installato un'altra app che cercando "991" mi restituisce anche il theme-responsive.css.
Di drupal e/o bootstrap ti intendi?

Per le modifiche pensavo di usare il modulo css injector di drupal