Ciao, sono nuovo in questo forum per cui mi presento, sono Luca. Piacere.
Arrivo subito alla questione, che sicuramente è una sciocchezza, però non riesco a risolvere!?
Come da oggetto, ho questo problema:
Un tema creato con l'ausilio di artisteer su drupal 6.22. Tutto funziona, tranne che quando ingrandisco o rimpicciolisco con control +/- o mela +/-
gli elementi non mantengono le proporzioni per cui si verificano sovrapposizioni delle immagini, uscita delle scritte dai blocchi, accavallamenti vari.
Qualcuno sa dirmi come intervenire, magari sui css, per fissare le proporzioni del tema?
Grazie a chiunque avrà la pazienza e la voglia di leggere qui, e magari darmi una mano
Non ci crederai ma pure qui succede, pure su google e su tutti i siti del mondo,
Primo non usare artisteer, il tema va fatto a mano quel programma li fa tutti uguali e con codice assurdo e complesso.
Il problema dello zoom è che un contenuto va visto a dimensioni reali, se l'utente deve fare lo zoom significa che il tuo tema non va bene, ad esempio per caratteri troppo piccoli.
http://www.chromeos.eu
Ciao, grazie per la risposta.
Per quanto riguarda artisteer sono d'accordo. Però volevo provarlo.
Per la parte sui siti invece non è così. Anche qui ad esempio, o su google, o su tutti i siti generalmente,
se ingrandisci, si ingrandisce tutto, le distanze tra gli elementi rimangono le stesse, non avvengono sovrapposizioni. E' necessario perchè non tutti vedono allo stesso modo. Quindi chi vede poco può ingrandire e far meno fatica. Prova su qualsiasi sito di quotidiano o magazine. Layout fisso, ed elastico. Qui invece è garland, che è layout fluido, e comunque mantiene le proporzioni.
A me invece si accavalla tutto, come se il background non andasse dietro al resto. Le scritte escono dalle colonne etc.
Credo che sia un problema di qualche position: fixed, da mettere relative. Ma fin ora, anche cambiando tutti i px con Em, o %, non ho avuto migliori risultati. Se interssa e si può metto il link così puoi vedere.
Pensavo fosse una cosa sciocca da risolvere. Invece mi sa che non se ne esce.
Secondo te non c'è un modo veloce per rendere un tema elastico intervenendo sui css?
Perfect Fluid Theme?
http://css-tricks.com/138-the-perfect-fluid-width-layout/
http://css-tricks.com/examples/PerfectFluidWidthLayout/
Poi se hai un CMS Drupal anche se si è capita la tecnica bisogna "costruirlo" allora:
1. o hai conoscenze tecniche specifiche (php,html,drupal,css,js)
2. o lo scarichi già fatto dal web (se lo trovi come vuoi tu)
3. o lo fai con programmi apposta (ad esempio artisteer)
4. oppure?
Io so fare i temi per Drupal ma ho così poco tempo tra tutto quello che devo fare che cerco soluzioni diciamo veloci che mi rendono facile il lavoro. Una bella idea mi è venuta: mettere un pò di temi da far scaricare!
Ciao Grazie
Ciao Danzisiweb, grazie per la tua risposta. Ora vado ad approfondire i link che mi hai segnalato.
Per questo sito ho usato artisteer per il tema, e poi sono intervenuto sui css per personalizzarne alcune parti.
Php lo conosco poco, giusto i rudimenti, mentre html e css li gestisco abbastanza bene.
La cosa che non capisco è come mai i temi generati con artisteer, perdano completamente le proporzioni se vengono ingranditi.
La domanda a cui ora cerco risposta, è se c'è un modo per chiudere tutto il layout in un div container con position: relative. E se questo ha un effetto sul mantenimento delle proporzioni.
La domanda è sicuramente sciocca. Ma a dispetto delle possibili apparenze, realizzo siti statici con html, xhtml + css da circa 3 anni. Idem per Drupal, che non mi ha mai dato problemi.
Invece questa volta, complice artisteer, mi trovo a dover risolvere questa cosa.
Nessuno ha già avuto questo problema?
(dopo aver analizzato i tuoi link, torno a dirti che ne penso)
ciao!
risolto qui: http://drupal.it/node/17068
addirittura un site-cross posting.
Il tuo problema non esiste, esistono gli occhiali per questo.
Inoltre il video è troppo grande e li basta agire sull'iframe.
Puoi usare un layout fluido ma comunque il "problema" ci sarà sempre.
Se metti un'immagine il problema ci sarà sempre, inoltre è solo una questione di css.
http://www.chromeos.eu
(ah, visto che le regole di questo forum consentono di inserire i link)
Il sito di cui parlo è questo: #
se lo visitate e provate a ingrandire con contro+ o mela+, si verificherà il problema che sto cercando di risolvere.
riciao, e rigrazie a chi mi da retta! :)
ciao ealmuno, ho visto ora la tua risposta.
Purtroppo il link che mi hai quotato è una richiesta sempre mia. Sempre su questo problema. Che non è ancora risolta.
Siamo tutti d'accordo che è un problema di CSS. Ora però si tratta di capire come intervenire sui css per risolverlo.
Se provi a vedere qui: http://www.lobodilattice.com
video immagini e tutto il resto, si ingrandiscono o rimpiccioliscono anche loro, non perdono le proporzioni. Vorrei arrivare allo stesso risultato...
(grazie per la disponibilità!)
I tuoi problemi è nelle immagini in alto, sostituiscile con una sola e il problema scompare, oppure crea un tuo tema e vedi che se rispetti gli standard (ora sono 33 errori di html e 36 di css tra cui alcuni molto gravi come: Numero non valido : min-height auto non è un valore per min-height : auto auto), per le immagini prova a non ridimensionarle con html (cioè con width) ma di farle delle dimensioni giuste e vedi che questa è un'altra soluzione.
http://www.chromeos.eu
Cavoli, ma a me quegli errori non escono. Hai usato firebug per scovarli?
se si, che versone hai. Oppure cosa hai usato?
Ora provo a risolvere quegli errori e vedere che succede.
Invece per l'immagine in alto, cosa intendi, dici di sostiuire completamente l'header, o altro?
Sempre grazie!
Piccolo consiglio, comincia da una guida di html e css di base, parlo di errori di validazione, si usa il validatore w3c.
Per le immagini in alto le hai scalate a codice co width e height, in realtà sono più grandi e nel web non va fatto così.
http://www.chromeos.eu
il problema è che il container è dimensionato in percentuale (perchè mai 60%, poi?).
Il browser si comporta di conseguenza e ingrandendo mantiene la percentuale.
dimensiona il container e dovresti risolvere il problema
(fermo restando che l'utente ha sempre il controllo della modalità di zoom)
Certified to Rock
Ciao Ragazzi, premetto che se fossi un super esperto non sarei qui a chiedere supporto a chi magari ne sa più di me. Intervengo sul forum solo dopo aver fatto tutte le ricerche che mi vengono in mente sul web, anche in inglese, of course.
Tutti abbiamo delle lacune e delle cose che sappiamo fare bene. La rete funziona proprio perchè le mie competenze possono essere tue, e viceversa. Quindi tornare a studiare la guida di base di html o css, non mi aiuta a risolvere il mio problema. Che poi ripassare e studiare faccia sempre bene, sono d'accordo. E di sicuro una ripassata la darò! Ok, scusate la premessa.
Dunque:
@Bohz, grazie per essere intervenuto. Il container a cui ti riferisci credo sia l'ultimo esperimento che ho fatto, ovvero ho inserito un div id container che racchiude tutto il layout, per vedere se in questo modo riuscivo a mantenere in proporzione anche gli elementi all'interno. Cosa che non è avvenuta. Però io ho messo il div a 100& non 60% quindi questa è la prima cosa strana.
@Ealmuno, al validatore w3c ci ero arrivato. Speravo ci fosse un addon per firefox tipo firebug, ma per la 5.1 ancora non c'è. Quindi sono andato qui: http://jigsaw.w3.org/css-validator/
E ho trovato la sfilza di errori, che ho corretto in parte. Perchè ci sono cose che non mi sono chiare:
-il codice dei css è scritto da artisteer, (ok tu non sei a favore), però di fatto l'ha scritto lui, quindi in teoria almeno negli standard dovrebbe essere corretto. Ad ogni modo ho fatto tutte le correzioni che ero in grado di fare e gli errori sono scesi considerevolmente. Però il problema dell'ingrandimento è rimasto. E anche altre cose strane!
Tipo: il modulo scrolltext di drupal, crea in automatico un che però il validatore non accetta e segnala come non riconosciuto. Essendo il modulo a crearlo, come posso manualmente sostituire il marquee con qualcosa di accettato e affine, sempre che esista. Ma soprattutto il testo scorrevole si vede funziona bene, perchè quindi non è accettato il ?
-molti errori del codice si riferiscono a fogli di stile secondari. Quelli per le versioni varie di IE. Mentre il sito è praticamente tutto sull'ordinario styles.css a cui ho apportato le correzioni.
-i ridimensionamenti sono stati fatti da FCK editor, direttamente in "aggiungi blocco" e inserendo poi l'URL dell'immagine.
Forse non è una pratica ottimale, però sempre su altri con immagini e anche video inseriti nello stesso modo, il problema se si ingrandisce, non si verifica. Qui si ingrandiscono anche il video di yutube e di vimeo.
SINTESI:
Ingrandendo, il body di tutto il sito - invece che ingrandirsi - si rimpicciolisce. In soldoni il rettangolo bianco che fa da sfondo al sito non si allarga, ma si stringe!!?!??
Dai ragazzi che ci arriviamo, è di sicuro un css da mettere diversamente da come è, ma quale???
Sempre grazie per la vostra disponibilità!
*Tipo: il modulo scrolltext di drupal, crea in automatico un < marquee > che però il validatore non accetta e segnala come non riconosciuto. Essendo il modulo a crearlo, come posso manualmente sostituire il marquee con qualcosa di accettato e affine, sempre che esista. Ma soprattutto il testo scorrevole si vede funziona bene, perchè quindi non è accettato il < marquee >?
Il validatore è si da seguire ma non alla lettera, se un sito è validato significa che molto probabilmente si vedrà bene su qualunque borwser, alcuni errori vanno ignorati, sta al webmaster decidere, io solitamente valido l'html e faccio una rapida correzione una volta trasferito tutto su drupal.
Io vedo errori http://www.arte-magazine.com/projectroom/sites/all/modules/thickbox/thic... e credo basti ignorarlo, il resto sono errori tuoi o proprietà non validabili (proprie dei browser o non css2)
Le immagini falle di dimensioni giuste, le carichi così, quello è una modifica da codice e non va fatta, inoltre potresti evitare di usare blocchi, magari è proprio quello che da i "problemi".
http://www.chromeos.eu
Interessante poter bypassare i blocchi. Te cosa usi al posto dei blocchi per ottenere un risultato affine?
In quel caso le metterei nel template, non ha senso creare una regione e blocchi per mettere 3 immagini, se devono essere dinamiche uso un case, ma fra blocchi e template cambia poco, nel secondo caso hai meno codice inutile e carico minore.
http://www.chromeos.eu
Zoom : avendo variazioni ottiche di mezzo grado durante la giornata secondo me un sito con A+ A- e zoom vari và più che bene da leggere.
Se ci sono plugin e temi che lo fanno di serie : probabile che molti altri abbiano "qualche problema" di calo della vista (più che di calo del.. Sito).
Il marque è stato squalificato dal w3c da parecchi anni (purtroppo..) forse c'era una alternativa (php) bisogna searciare su Googl.
Resto convinto (da anni) che togliere il marque come ok valido w3c sia stata una gran stupidaggine.
Ciao Ealmuno, ho capito.
In realtà quei tre blocchi con immagine servono solo per la versione demo. Per far vedere che ci saranno dei contenuti piazzati in quel modo. Nella versione definitiva saranno dinamici, fatti con 3 viste. Ad ogni modo c'è di sicuro il modo di inserire dei css che tengano il layout in proporzione. Grazie per le tue risposte.
Lorenzo grazie dell'intervento. Sarà che ho problemi di vista, però di fatto alcuni siti mantengono le proporzioni di tutto, anche ingranditi, mentre altri le perdono. Ora questa differenza sarà riconducibile a qualcosa?
Dai ragazzi, perchè qui a parte battutine allusive alle mie possibili incompetenze, nessuno è riuscito a trovare una soluzione, quindi mi sa che siamo sulla stessa barca.
Ricapitoliamo,
PROBLEMA DA RISOLVERE:
questo è il sito: # (SITO 1)
se si fa control + per ingrandire (pratica davvero MOLTO comune) il sito perde di proporzioni, i blocchi escono dalle colonne.
per capire la differenza, guardare anche questo sito: http://www.lobodilattice.com (SITO 2)
sempre drupal 6.22. Però con proporzioni sempre fisse. Provare per credere.
Ecco, c'è qualcuno che sa dirmi come intervenire sui css per rendere l'ingrandimento del SITO 1 come quello del SITO 2 ???
Grazie per la disponibilità!
Ok, miei carissimi super esperti, sono riuscito a risolvere da solo :)
Ho inserito questo nei css:
#container {
width:1610px;
margin: 0 auto;
padding:0 0 0 0;
text-align:left;
}
e finalmente l'ingrandimento adesso è proporzionato!!
Ora ho un altro problemino però. Questo credo sia facile da risolvere:
andando sul sito #
c'è un margine esagerato a sinistra.
Ho smanettato dentro ai css per toglierlo, ma non ci riesco!?
Qualche consiglio?
(grazie per la disponibilità e le risposte, ma anche no per quelle che dicono tutto tranne che affrontare le richieste! ;) )
peace and love,
ciao!
Divertente, ma forse una guida base base ma proprio base di css di farebbe comodo.
Hai fissato la dimensione a 1610px, se hai uno schermo del genere allora non hai problemi, altrimenti rimettila a 960px.
Evita di dire certe cose per fare una figura magra come questa. Il tuo problema non esiste, è un'assurdità quella che vuoi fare.
http://www.chromeos.eu
Ciao Ealmuno, dai come sei acido, ero ironico io. Un po' di umorismo!! :)
Come monitor viaggio su un apple cinema display da 27, quindi ok.
Però deve funzionare su tutti.
Il problema del layout che perde le proporzioni è risolto. Se provi adesso, si ingrandisce tutto, comprese immagini nei blocchi con i width in px e il video con iframe.
Sulla dimensione esagerata, sono d'accordo, però se metto 960, il body si stringe all'inverosimile. Con questa misura, stava giusto. Comunuque è tutto ancora in test.
Secondo te, a parte le misure, il resto è corretto?
Come modificheresti padding e margin, ma il padding poi in un div container, serve davvero?
#container {
width:1610px;
margin: 0 auto;
padding:0 0 0 0;
text-align:left;
}
ciao grazie!
il container lo ripristini, non si possono fare modifiche a caso, è quello che causa il problema (nessun problema-->cambio una cosa-->problema-->quella cosa che cambio è il problema)
Il padding è per il reset, è il text-align che non serve. Se vuoi ingrandire i caratteri metti un pulsante che cambi il font-size, lo zoo non deve essere un tuo problema, il sito va visto a dimensioni originali.
http://www.chromeos.eu