Media queries - Opsta diskusija

1

Media queries - Opsta diskusija

offline
  • Pridružio: 25 Mar 2015
  • Poruke: 548

Postovanje, imam ovako radi svoje vezbe






@media screen and (max-width:768px){    .container{       width:100%; } #intro-bg h2 {     transition: .2s ease-out;     font-size: 28px !important;     font-family: 'Raleway', sans-serif; } .navbar-default .navbar-brand {           font-size: 16px !important;   } .navbar-nav > li > a {     padding-top: 10px;     padding-bottom: 10px;     line-height: 5px;     font-size: 12px !important;     font-weight: 800;     margin-top: 15px;     color: rgb(99, 154, 143) !important; }
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.
offline
  • Pridružio: 02 Sep 2003
  • Poruke: 4905

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



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
padding-top: 2px !important;     padding-bottom: 2px !important;

offline
  • Programer
  • Pridružio: 23 Maj 2012
  • Poruke: 4534

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.

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?

offline
  • Pridružio: 02 Sep 2003
  • Poruke: 4905

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

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     margin-top: -30px; Bilo sta pozitivno ne radi.


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



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

w3schools.com/cssref/playit.asp?filenam.....reval=25px

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     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

offline
  • Pridružio: 25 Mar 2015
  • Poruke: 548

Ovako kako sam ga zadao ne moze fa fa-diamond 100px width i 100px height .intro-text .fa {   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.

offline
  • Pridružio: 25 Mar 2015
  • Poruke: 548

Reseno ovako


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

Ko je trenutno na forumu
 

Ukupno su 669 korisnika na forumu :: 28 registrovanih, 2 sakrivenih i 639 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: -[CoA]-, AF-1, Bane san, bojank, Brksi, BSD, cikadeda, dac, dejanru, dragon986, dule clio, havoc995, Hoegaarden, ILGromovnik, Ilija Grubor, Insan, Klecaviks, Leonardo, nemkea71, Ognjen D., pavle_pzs, Rakenica, sabros, sovanova95, Srki98, trajkoni018, Vezista, zljubomir