MyCity » Web dizajn / HTML » Media queries - Opsta diskusija

Media queries - Opsta diskusija

Napisano na dan: 8.2.2016
1

Media queries - Opsta diskusija
Sledeća strana Pagination

Idi na vrh

Poslao: 08 Feb 2016 21:16
Idi na vrh
offline
  • Pridružio: 25 Mar 2015
  • Poruke: 548

Postovanje, imam ovako radi svoje vezbe






  1. @media screen and (max-width:768px){
  2.    .container{
  3.       width:100%;
  4. }
  5. #intro-bg h2 {
  6.     transition: .2s ease-out;
  7.     font-size: 28px !important;
  8.     font-family: 'Raleway', sans-serif;
  9. }
  10. .navbar-default .navbar-brand {
  11.      
  12.     font-size: 16px !important;
  13.  
  14. }
  15. .navbar-nav > li > a {
  16.     padding-top: 10px;
  17.     padding-bottom: 10px;
  18.     line-height: 5px;
  19.     font-size: 12px !important;
  20.     font-weight: 800;
  21.     margin-top: 15px;
  22.     color: rgb(99, 154, 143) !important;
  23. }

Stavio sam line-height: 5px; ako stavim i important ne radi ili sam nesto izostavio, ili na brzinu ne vidim u cemu je problem
Hteo bih da smanjim razmak izmedju Home, About, Contact. Da li je potrebno ili je ovako ok. Hvala i pozdrav



Registruj se da bi učestvovao u diskusiji. Registrovanim korisnicima se NE prikazuju reklame unutar poruka.
Poslao: 08 Feb 2016 21:44
Idi na vrh
offline
  • Pridružio: 02 Sep 2003
  • Poruke: 4956

Smanji padding-top i padding-bottom na 5px pa vidi kako se ponaša



Poslao: 08 Feb 2016 22:40
Idi na vrh
offline
  • Pridružio: 25 Mar 2015
  • Poruke: 548

Djole ::Smanji padding-top i padding-bottom na 5px pa vidi kako se ponaša
Moze ali uz important, da li je to pravilno ili ne ... radi

  1. padding-top: 2px !important;
  2.     padding-bottom: 2px !important;
Poslao: 08 Feb 2016 22:42
Idi na vrh
offline
  • Programer
  • Pridružio: 23 Maj 2012
  • Poruke: 4576

Kada staviš !important atribut znači da povećavaš prioritet toj vrednosti i da, čak iako kasnije definišeš drugačiju vrednost, biće primenjena ona koja je definisana sa njim. Pravilno je, ali nije preporučljivo uvek to raditi.

Poslao: 08 Feb 2016 22:49
Idi na vrh
offline
  • Pridružio: 25 Mar 2015
  • Poruke: 548

Znam citao sam o tome, kako kazu ako se nezna kako to uraditi pribegava se postavljanju atributa !important. Da li to tacna izjava koja ja prosirena internetom?

Poslao: 08 Feb 2016 23:02
Idi na vrh
offline
  • Pridružio: 02 Sep 2003
  • Poruke: 4956

Znači da je još negde definisan padding, pa uzima tu vrednost. Proveri sa inspect element šta mu je aktivno.
Verovatno je negde u bootstrap css-u definisan padding za navbar, pa on ima prioritet

Poslao: 08 Feb 2016 23:30
Idi na vrh
offline
  • Pridružio: 25 Mar 2015
  • Poruke: 548

Na primer u ovom slucaju fontawsome ne ide preko 30px sta god da stavim ne radi. Probao sam ovako to radi ali ne preko 30px

  1. margin-top: -30px;
Bilo sta pozitivno ne radi.


  1. .intro-text .fa {
  2.   font-size: 72px !important;
  3.       margin-top: -30px;
  4. }
  1. <header id="intro-bg">
  2.         <div class="container ">
  3.             <div class="row">
  4.                 <div class="col-md-12">
  5.                     <div class="intro-text">
  6.                         <h2>Create web site with Ruby on Rails framework<h2>
  7.                         <p><i class="fa fa-diamond"></i> </p>
  8.                     </div>
  9.                 </div>
  10.             </div>
  11.         </div>
  12.     </header>



Poslao: 09 Feb 2016 00:14
Idi na vrh
offline
  • Pridružio: 02 Apr 2006
  • Poruke: 43

Napisano: 09 Feb 2016 0:09

Meni bode oci .navbar-nav > li > a ... Osim ako nemas jos jednu slicnu navigaciju pa da moras da mu zadas "nadji svaki <a> koji je direktno "dete" <li> koje je direktno "dete" .navbar-nav onda je nepotrebno... .navbar-nav li a je sasvim dovoljno... Druga stvar, imas po 10px top i bottom padding+ margin-top svakog <a> od 15px, eto ti taj prostor najverovatnije Smile Na kraju oko line height-a... Neki nazovi ga standard maltene kod svakog browsera je 20 px (oko 120%)...Kad imas pravilo koje podrzava IE4 onda ti je otprilike jasno da je samo pravilo doooooosta davno prihvaceno i implementirano kod svih...Upravo zato je ponekad potrebno da se covek priseti kako line-height funkcionise.. Najbolji primer za to je ovo

[Link mogu videti samo ulogovani korisnici]

Sto se !important-a tice semanticki ti je ok, niko ne brani... Ali jednostavno uvek mozes da nadjes sta ti zeza layout, bukvalno uvek...Ako te mrzi onda zalepi important i toliko, ne znam kako drugacije da te savetujem Smile

Dopuna: 09 Feb 2016 0:14

[quote="dejnik978"]Na primer u ovom slucaju fontawsome ne ide preko 30px sta god da stavim ne radi. Probao sam ovako to radi ali ne preko 30px

  1. margin-top: -30px;
Bilo sta pozitivno ne radi.

aj ciljaj fa fa-diamond sa jedno 100px width i 100px height pa vidi da li se menja Smile

Poslao: 09 Feb 2016 00:55
Idi na vrh
offline
  • Pridružio: 25 Mar 2015
  • Poruke: 548

Ovako kako sam ga zadao ne moze fa fa-diamond 100px width i 100px height

  1. .intro-text .fa {
  2.   font-size: 72px !important;
. Videcu da prepravim kod, da bi mogao ikonicu da pomerim malo navise. Ovo je primer za media queries rezolucije 320px i manje. Na ostalim rezolucijama se vidi odlicno.

Poslao: 09 Feb 2016 20:31
Idi na vrh
offline
  • Pridružio: 25 Mar 2015
  • Poruke: 548

Reseno ovako


  1. <h2>Create web site with Ruby on Rails framework<br>
  2.          <i class="fa fa-diamond"></i>
  3. </h2>

MyCity » Web dizajn / HTML » Media queries - Opsta diskusija

Ko je trenutno na forumu
 

Ukupno su 802 korisnika na forumu :: 9 registrovanih, 0 sakrivenih i 793 gosta   ::   [ Administrator ] [ Supermoderator ] [ Moderator ] :: Detaljnije

Najviše korisnika na forumu ikad bilo je 3466 - dana 01 Jun 2021 17:07

Korisnici koji su trenutno na forumu:
Korisnici trenutno na forumu: aleksjevt, comi, eagle.rs, Ivan Gajic, lcc, LUDI, Milan A. Nikolic, mladen.zovko, repac