Bootstrap 3

• 0Niko još nije pohvalio poruku.
  Registruj se da bi pohvalio/la poruku!

Napisano: 16 Jun 2015 10:54

Kako da odradim box samo za jedan col-md-2 ovako je za celi container
  .pozadina_aktuelnosti_2 {    margin: 5px 5px 5px 5px;    width: auto;    background: #fff;     box-shadow: 5px 5px 10px #888888;    background-color: #FFF;    border: 3px solid #E7E7E7;   }




Na primer za jedan ovaj mali col-md-2



Odradio sam ovo
css
.prvibox {   margin: 5px 5px 5px 5px;    width: auto;    background: #fff;     box-shadow: 10px 10px 5px #888888;    background-color: #FFF;    border: 3px solid #E7E7E7;   } isto kao kod celog containera ali se ne desava nista

html



Radi ovako, sad samo da se podesi da lepo izgleda.

• 0Niko još nije pohvalio poruku.
  Registruj se da bi pohvalio/la poruku!

Dopuna: 16 Jun 2015 15:24

dejnik978 ::Iskodirao sam ovako nesto, sad me zanima koja je skripta js npr ili nesto slicno koja bi odvajala ove blokove da kad prelazim misem preko njih da se pomeraju da li to radi jquery ili? Ako moze neki link da pogledam, hvala



Reseno:

Ova skripta moze da pomera div samo da se podesi
$(document).ready(function() {    $('div').mouseenter(function() {        $(this).animate({            height: '+=10px'        });    });    $('div').mouseleave(function() {        $(this).animate({            height: '-=10px'        });    });    $('div').click(function() {        $(this).toggle(1000);    }); });

• 0Niko još nije pohvalio poruku.
  Registruj se da bi pohvalio/la poruku!

Novi update bootstrapa 3.3.5
[Link mogu videti samo ulogovani korisnici]

• 0Niko još nije pohvalio poruku.
  Registruj se da bi pohvalio/la poruku!

Da li je ispravno da odvojim ova dva containera ovako, nema problema na manjim rezolucijama
margin: 50px 20px 50px 20px;

.prvi_deo {    color:#C2C4C0;    text-align: center;    box-shadow: 0 0 2px black;    padding-bottom: 10px 0 0 10px;    margin: 50px 20px 50px 20px; } .drugi_deo {    color:#C2C4C0;    text-align: center;    box-shadow: 0 0 2px black; }

• 0Niko još nije pohvalio poruku.
  Registruj se da bi pohvalio/la poruku!

Napisano: 18 Jun 2015 1:49

Vezbam ovako nesto i opera nece da prihvati boju za h2. Trenutno ne vidim zasto a radi na firefoxu.
Opera ne prihvata boju za h2


Firefox prihvata boju



cod
 <div class="prvi_deo">                 <div class="container">                     <div class="row">                       <div class="col-md-12">                           <h2><a href="#">Kalendar radova u malinarstvu</a></h2>                           <p>Jun</p>                           <p>Berba malina</p>                           <p>                             Prskanje malina preparatima protiv bolesti –Switch<br> (pred berbu, pre nego što su plodovi zreli).<br>  Berba i prodaja malina. <br> Navodnjavanje malina (ako ima potrebe).                                 </p>                       </div>                     </div>                 </div>               </div>
a:link { color:#7B9E67; text-decoration: none; } a:hover {    color:red; } .prvi_deo {        text-align: center;    box-shadow: 0 0 2px black;    padding-bottom: 5px 0 0 5px;    margin: 50px 20px 50px 20px;    color:#7B9E67;     } .prvi_deo h2 {    font-family: 'Alex Brush', cursive;    font-weight: bold;    font-size: 44px;    color:#7B9E67; }

Interesuje me i ovo posto vdim da se u css-u dosta toga ponavlja da podesim npr za classu pa za istu posebno h2, pa h3, pa za p itd pa css ode u 1m. To bi trebalo da resi Sass ili ? na ovoj adresi ima nesto za pocetnike
[Link mogu videti samo ulogovani korisnici]

Kako ide za pocetnike, kako ste vi poceli? Hvala pozdrav

Dopuna: 18 Jun 2015 13:40

Neznam zasto ali sada radi na oba browsera boja za h2

• 1Ovo se svidja korisniku: dejnik978
  
  Registruj se da bi pohvalio/la poruku!

Prvo sto treba da uradis kada sumnjas da browser "ne prihvata" neki code koji bi ocigledno morao da radi, pritisni ctrl+f5 dok si na toj stranici koju pregledas. Ume cache da zeza, a ova kombinacija je upravo lek za takve stvari.

• 0Niko još nije pohvalio poruku.
  Registruj se da bi pohvalio/la poruku!

Vezbam ovako nesto da li je ispravno ovako. Rad u bootstrap okruzenju
Da povezem stranice u php-u
<?php require 'includes/jumbotron.php';?>
<?php require 'includes/malina.php';?>
<?php include 'includes/footer.php'; ?>

deo coda

<div class="container">                     <div class="row">                       <div class="col-md-3">                           <h4><a href="#">Malina</a></h4>                            <img src="img/berba_malina.jpg" class="img-responsive img-thumbnail" alt="berba jagoda">                           <p><em>Cena:200din/kg</em></p>                           <?php require 'includes/malina.php';?>                           <hr>                        </div>                                                                   <div class="col-md-3">                             <h4><a href="#">Kupina</a></h4>                              <img src="img/berba_kupina.jpg" class="img-responsive img-thumbnail" alt="berba jagoda">                               <p><em>Cena:200 din/kg</em></p>                             <?php require 'includes/kupina.php';?>                                   <hr>                         </div>                           <div class="col-md-3">                                            <h4><a href="#">Visnja</a></h4>                                   <img src="img/berba_visanja.jpg" class="img-responsive img-thumbnail" alt="berba jagoda">                                   <p><em>Cena:200 din/kg</em></p>                                   <?php require 'includes/kupina.php';?>                                   <hr>                           </div>                            <div class="col-md-3">                               <h4><a href="#">Jagoda</a></h4>                                   <img src="img/berba_jagoda.jpg" class="img-responsive img-thumbnail" alt="berba jagoda">                                   <p><em>Cena:200 din/kg</em></p>                                   <?php require 'includes/kupina.php';?>                                   <hr>                            </div>                       </div>                     </div>
Rezultat







U malina.php se nalazi forma

 <div id="formular">                 <div class="container">                   <div class="row">                     <div class="col-md-12">                             <form method="post">                                <p>                                 <label for="voće">Voće:</label>                                 <select name="voće" id="voće">                                   <option value="malina" selected>Sveza malina</option>                                   <option value="smrznuta malina">Smrznuta malina</option>                                   <option value="sok od maline">Sok od maline</option>                                   <option value="dzem od malina">Dzem od malina</option>                                 </select>                               </p>                               <p>                                 <label form="quantity">kg:</label>                                   <input name="quantity" type="number" id="quantity" min="0" value="0">                               </p>                                                             <p>                                 <input type="submit" name="naruči" id="naruči" value="naruči">                                 <input type="hidden" name="cena" id="price" value="100">                               </p>                             </form>                     </div>                   </div>                 </div>               </div>
Npr da li mogu da se koriste nasa slova umesto dz da napisem dž kod option value, i da li moze da se napise i u option value (opciona vrednost) veliko slovo Dz ili mora malo slovo dz.
<option value="dzem od malina">Dzem od malina</option>

• 0Niko još nije pohvalio poruku.
  Registruj se da bi pohvalio/la poruku!

Kako da podesim text na sredini carousela, probao sa padding i margin ali ne ide. Pozdrav
span { color:grey;     font-family: 'Oswald', sans-serif;     font-size: 50px }
<div class="carousel-inner" role="listbox">     <div class="item active">       <img src="img/1.jpg" alt="...">       <div class="carousel-caption">        <span><strong>Aktuelnosti u proizvodnji malina</strong>           </span>       </div>     </div>.....



Pronasao sam odgovor na pitanje ali kako da ga primenim probao ali nista?
.text-center{    text-align: center !important;   }  <p class="text-center">

.carousel-caption { text-align: center; }
.carousel-caption span { }

Ja sam postavio u html
 <div class="carousel-inner" role="listbox">         <div class="item active">           <img src="img/1.jpg" class="img-responsive" alt="...">           <div class="carousel-caption">            <span><strong><p class="text-center">Aktuelnosti u proizvodnji malina</p></strong>               </span>           </div>         </div>

dodao sam class="text-center" da bih podesio u css-u i dodao ovako

span {     color:grey;     font-family: 'Oswald', sans-serif;     font-size: 50px; } .carousel-caption { text-align: center; } .carousel-caption span { text-align: center; } .text-center{    text-align: center !important;   }

Ne radi

• 1Ovo se svidja korisniku: dejnik978
  
  Registruj se da bi pohvalio/la poruku!

Prvo proveri da li klasi .carousel-inner zadana relativna pozicija, ako nije zadaj je.


.carousel-inner {   position: relative; }

To radis da bi u odnosu na nju apsolutno pozicionirao natpis. A natpis apsolutno pozicioniras i centriras na sledeci nacin.

.carousel-caption {     left: 0;     position:absolute;     text-align:center;     top: 50%;     width: 100%; }

• 0Niko još nije pohvalio poruku.
  Registruj se da bi pohvalio/la poruku!

m4rk0 ::Prvo proveri da li klasi .carousel-inner zadana relativna pozicija, ako nije zadaj je.


.carousel-inner {   position: relative; }

To radis da bi u odnosu na nju apsolutno pozicionirao natpis. A natpis apsolutno pozicioniras i centriras na sledeci nacin.

.carousel-caption {     left: 0;     position:absolute;     text-align:center;     top: 50%;     width: 100%; }


Radi, hvala, majstorski odreadjeno. Ovaj naslov koji ne odgovara velicini ekrana treba podesiti preko media queries da bi se prikazao naslov adekvatno velicini ekrana posto je slider responsiv da li je tako?