• Regolamento Macrocategoria DEV
    Prima di aprire un topic nella Macrocategoria DEV, è bene leggerne il suo regolamento. Sei un'azienda o un hosting/provider? Qui sono anche contenute informazioni per collaborare con Sciax2 ed ottenere l'accredito nella nostra community!

Visione storpiata elementi su mobile

alex92008

Utente Assiduo
2 Maggio 2010
733
0
37
Library/Application/
Miglior risposta
0
#1 Autore del topic
Buongiorno, scrivo a voi per chiedere delucidazioni in merito ad una problematica che ho su un sito che sto creando (No wordpress, codice puro).

Questo è come si visualizza una porzione di pagina normalmente

Non appena si utilizza un cellulare o comunque la modalità mobile di un browser il risultato cambia:

I campi vanno a capo (come mi va bene che sia) ma senza lasciare un minimo di spazio tra una riga e l'altra mostrandosi appiccicate. I tasti nelle tabelle inoltre risultano avere lo stesso identico problema, vanno a capo senza lasciare spazi. Quale modifica devo apportare sul foglio di stile per evitare che accada questo? Nell'elenco rapporti utilizzo una table con una classe a se, nel promemoria uso un form-inline.

Grazie per l'attenzione
 

Hamburger

Utente Strepitoso
3 Settembre 2010
5.514
49
67
Foggia
Miglior risposta
0
#2
Ciao dovresti utilizzare le media queries nel foglio di stile, posso farti un piccolo esempio poi sta a te adattarlo alle tue esigenze:
CSS:
@media screen and (min-width: 400px) and (max-width: 1100px) {
.classebottoneviola {
margin-bottom:10px;  //distanza che vuoi impostare
}
}
 

dunkerc

Utente Esperto
1 Settembre 2014
1.333
121
139
Catania
Miglior risposta
0
#3
Questo è proprio un "effetto collaterale" di creare siti responsive: devi fare in modo che si veda "bene" in tutti i dispositivi. Un consiglio, oltre a quello dato da Hambuger, è quello di utilizzare più possibile le percentuali. Comunque nei browser moderni puoi avere la possibilità di modificare la lunghezza dello schermo secondo vari modelli di smartphone/tablet e quindi sistemare la storia (Y)
 

alex92008

Utente Assiduo
2 Maggio 2010
733
0
37
Library/Application/
Miglior risposta
0
#4 Autore del topic
Vi ringrazio moltissimo, faccio qualche prova e vi aggiorno. Purtroppo il sito DEVE essere responsive per ovvi motivi... Grazie ancora!

(Ho fatto qualche prova, il risultato è sorprendente, grazie moltissime per l'aiuto!)
 
Ultima modifica:
Shoutbox
  1. #KiK #KiK: we mon friendz
  2. K keepout00: ue strunz
  3. Keep-out Keep-out: vbullettin state of mind
  4. Keep-out Keep-out: ci vorrebbe una skin un pò più old school, sarà che sono rimasto al 2009 ma con questa mi perdo ahah
  5. Keep-out Keep-out: hola
  6. Slimy Slimy: Buonasera
  7. Mavio Mavio: Habbo sta creando un nuovo "gioco", con nuovi aggiornamenti, a dirlo è stesso la pagina ufficiale di habbo su instagram
  8. INFINITY987 INFINITY987: muore
  9. UNI▼ERS▲L UNI▼ERS▲L: Che fine farà Habbo ora che il supporto di Adobe Flash Player cesserà?
  10. #KiK #KiK: weeeeee
  11. -Sicily94- -Sicily94-: https://www.sciax2.it/forum/threads/progetto-sicily-hotel-beta-test-serio.700314/
  12. eskereboyz eskereboyz: https://www.sciax2.it/forum/threads/account-habbo.700424/
  13. DarkKB DarkKB: @999k https://www.sciax2.it/forum/threads/new-luxworld.700391/
  14. 999k 999k: https://www.sciax2.it/forum/threads/ihabbon-project.700336/
  15. 999k 999k: Retro innovativi ne abbiamo?
  16. JaxosItalia JaxosItalia: https://www.sciax2.it/forum/threads/jaxos-hotel.700052/
  17. DarkKB DarkKB: https://www.sciax2.it/forum/threads/new-luxworld.700391/
  18. #KiK #KiK: Amiciiiii
  19. Mr. Aizen Mr. Aizen: Buondì
  20. F FulmineVerde: https://www.sciax2.it/forum/threads/aumentare-prestazioni-del-pc.700408/
  21. -Sicily94- -Sicily94-: https://www.sciax2.it/forum/threads/progetto-sicily-hotel-beta-test-serio.700314/
  22. TokosRetro TokosRetro: Salve
  23. -Marco -Marco: Ciao bellissimi!
  24. #KiK #KiK: Siiii
  25. Cristoforo58 Cristoforo58: Kaffeee?!1!1!11 @#KiK
Top