4 odpowiedzi na ten temat

[skixd10]

Witam,

Kiedyś ktoś mi zrobił, aby menu w sklepie było stałe, aby tylko treść przesuwała się jak i na komputerach i telefonach. Sklep: sklep.fonetika.pl

Chciałbym usunąć z telefonów te stałe menu, ale z komputerów zostawić. Jak to zrobić ? W jakim pliku ?

 

Z góry bardzo dziękuję

[vekia]

na końcu pliku global.css wstaw kod:

@media (max-width:768px) {
  .header-container {
    position: relative!important;
  }
  .columns-container {
    margin-top: 30px;
  }
}

po zapisaniu zmian w pliku aby były natychmiast widoczne dla przeglądarki odśwież sklep metodą ctrl+f5 lub wyczyśc cache przeglądarki

[skixd10]

Dodałem ten kod zamiast tego, który był:

@media (max-width: 1200px){
.contact-block {
    margin: 0 auto;
    float: none;
    width: 100%;
}
}

 

I niestety nic się nie zmieniło na telefonach

 

Edit. Nawet jeśli dodałem pod tym kodem, to też bez zmian.

 

Z tego co udało mi się znaleźć, to odpowiada za stałe menu, które zostaje zawsze na górze strony:

/* Robsa.pl - zmieniłem tu na header przyklejony*/
.header-container{
  background: white; }
 
.header-container {
    position: fixed;
    top: 0;
    width: 100%;
    z-index: 2000;
    box-shadow: 0 0 5px rgba(0,0,0,0.5);
}

 /* Robsa.pl - zmieniłem tu na header przyklejony*/
 
.breadcrumb {
  display: inline-block;
  padding: 0 11px;
  border: 1px solid #d6d4d4;
  font-weight: bold;
  font-size: 12px;
  line-height: 24px;
  min-height: 6px;
  -webkit-border-radius: 3px;
  -moz-border-radius: 3px;
  border-radius: 3px;
  overflow: hidden;
  margin-bottom: 16px;
  position: relative;
  z-index: 1; }
  .breadcrumb .navigation-pipe {
    width: 18px;
    display: inline-block;
    text-indent: -5000px; }
  .breadcrumb a {
    display: inline-block;
    background: white;
    padding: 0 15px 0 22px;
    ;
    position: relative;
    z-index: 2;
    color: #333333; }
    .breadcrumb a.home {
      font-size: 17px;
      color: #777777;
      width: 38px;
      text-align: center;
      padding: 0;
      margin: 0 0 0 -10px;
      -moz-border-radius-topleft: 3px;
      -webkit-border-top-left-radius: 3px;
      border-top-left-radius: 3px;
      -moz-border-radius-bottomleft: 3px;
      -webkit-border-bottom-left-radius: 3px;
      border-bottom-left-radius: 3px;
      z-index: 99;
      line-height: 22px;
      display: inline-block;
      height: 25px; }
      .breadcrumb a.home i {
        vertical-align: -1px; }
      .breadcrumb a.home:before {
        border: none; }
    .breadcrumb a:after {
      display: inline-block;
      content: ".";
      position: absolute;
      right: -10px;
      top: 3px;
      width: 18px;
      height: 18px;
      background: white;
      border-right: 1px solid #d6d4d4;
      border-top: 1px solid #d6d4d4;
      border-radius: 2px;
      text-indent: -5000px;
      z-index: -1;
      -webkit-transform: rotate(45deg);
      -ms-transform: rotate(45deg);
      transform: rotate(45deg); }
    .breadcrumb a:before {
      display: inline-block;
      content: ".";
      position: absolute;
      left: -10px;
      top: 3px;
      width: 18px;
      height: 18px;
      background: transparent;
      border-right: 1px solid #d6d4d4;
      border-top: 1px solid #d6d4d4;
      border-radius: 2px;
      text-indent: -5000px;
      z-index: -1;
      -webkit-transform: rotate(45deg);
      -ms-transform: rotate(45deg);
      transform: rotate(45deg); }
    .breadcrumb a:hover {
      color: #777777; }

.ie8 .breadcrumb {
  min-height: 1px; }
  .ie8 .breadcrumb a:after {
    display: none; }
  .ie8 .breadcrumb .navigation-pipe {
    width: 20px; }

Chciałbym usunąć, aby na urządzeniach mobilnych nie przesuwało się.

[vekia]

zmiany są widoczne, nagłówek nie jest przyklejony wraz ze scrollem.

Po zmianach trzeba wyczyścić cache przeglądarki (pamięta zawartość startych plików css)

[skixd10]

Chyba źle, to napisałem Chodzi mi o to, aby treść na telefonach przesuwała się wraz z nagłówkiem, a w tej chwili nagłówek jest statyczny. Teraz jest tak: https://iv.pl/images...67826366335.png ze tekst przewinięty wjezdza pod nagłówek, a chciałbym, aby nagłówek przesuwał się tak jak treść, ale tylko na urządzeniach mobilnych.

 

Z góry dziękuję już za dotychczasową pomoc