Prikazi cijelu temu 16.04.2020 23:37
mirsadz Van mreze
Administrator
Registrovan od:26.05.2011
Lokacija:BiH


Predmet:Re: Responsive web stranica
Pozdrav Avko,
sto se tice responzivnog dizajna mislim da si sve okej napravio... Inace ima tu jos sitnica, ovisno sta konkretno pravis, potrebno je za odredjene elemente odrediti "max-width", takodjer za fontove mozes koristiti "vw" jedinicu umjesto "px" (vw - viewport width), tako da ce velicina texta pratiti velicinu prozora browsera. Ako sam dobro razumio tvoje pitanje, imas problem sa razvlacenjem forme do odredjene granice...tacnije glavni elementi forme ostaju pri vrhu, a u ostatku forme se prikazuje kao prazan prostor i razvucen je.

PreuzmiIzvorni kôd (CSS):
  1. @media only screen and (max-width: 768px) {
  2.  
  3. .header {
  4.         width: 100%;
  5.         margin: 0px auto 0px;
  6.         color: white;
  7.         background: #5F9EA0;
  8.         text-align: center;
  9.         border: 1px solid #B0C4DE;
  10.         border-bottom: none;
  11.         border-radius: 10px 10px 0px 0px;
  12.         padding: 20px;
  13. }
  14.  
  15. form, .content {
  16.        
  17.         width: 100%;
  18.         height: 100%;
  19.         margin: 0px auto;
  20.         padding: 20px;
  21.         border: 1px solid #B0C4DE;
  22.         background: white;
  23.         border-radius: 0px 0px 10px 10px;
  24. }
  25. .input-group{
  26.         width: 100%;
  27.        
  28. }
  29. }

Ukoliko uklonis "height: 100%" iz klase "form, .content" u ovom dijelu, ta praznina ce nestati. Kod bi trebao izgledati ovako:

PreuzmiIzvorni kôd (CSS):
  1. form, .content {
  2.        
  3.         width: 100%;
  4.         margin: 0px auto;
  5.         padding: 20px;
  6.         border: 1px solid #B0C4DE;
  7.         background: white;
  8.         border-radius: 0px 0px 10px 10px;
  9. }

Nadam se da ce ti ovo biti od pomoci.