Vydělávej až 160.000 Kč měsíčně! Akreditované rekvalifikační kurzy s garancí práce od 0 Kč. Více informací.
Hledáme nové posily do ITnetwork týmu. Podívej se na volné pozice a přidej se do nejagilnější firmy na trhu - Více informací.
Avatar
Michal Kuba
Tvůrce
Avatar
Michal Kuba:15.11.2015 18:37

Ahoj!.
Máte někdo nápad, jak se zbavit mýho problému?
Mám responzivní web. Až teď jsem se dostal k dodělání menu, které předtím fungovalo, ale teď ne. Na určitém breakpointu mám nastaveno, aby bylo menu collapse, tudíž se po kliknutí jakoby rozvinulo. Jenže mi to pouze překrývá horní obsah a ne že by ho to posunulo dolů.

Struktura je zhruba taková:

<nav class="navbar navbar-default">
  <div class="container-fluid">
    <div class="navbar-header">
      <button type="button" class="navbar-toggle" data-toggle="collapse" data-target="#myNavbar">
        <span class="icon-bar"></span>
        <span class="icon-bar"></span>
        <span class="icon-bar"></span>
      </button>

    </div>
    <div class="collapse navbar-collapse" id="myNavbar">
      <ul class="nav navbar-nav navbar-left">
        <li class="dropdown">
          <a class="dropdown-toggle" href="zobraz.asp?t=kontakty">KLUB</a>
          <ul class="dropdown-menu">
            <!-- #include file="menu_01.inc" -->
          </ul>
        </li>
        <li>
          <img class="menu-kladivo" src="./img/kladivo2.PNG">
        </li>
        <li class="dropdown">
          <a class="dropdown-toggle" href="soupiska.asp">MUŽI</a>
          <ul class="dropdown-menu">
            <!-- #include file="menu_02.inc" -->
          </ul>
        </li>
        <li>
          <img class="menu-kladivo" src="./img/kladivo2.PNG">
        </li>
        <li class="dropdown">
          <a class="dropdown-toggle" href="zapas.asp?sezona=<% =left(akt_sezona_mladez,4) %>B" title="Team "B"">MLÁDEŽ</a>
          <ul class="dropdown-menu">
            <!-- #include file="menu_03.inc" -->
          </ul>
        </li>
        <li>
          <img class="menu-kladivo" src="./img/kladivo2.PNG">
        </li>
        <li class="dropdown">
          <a class="dropdown-toggle" href="zapas.asp?sezona=2011PVP">POHÁRY</a>
          <ul class="dropdown-menu">
            <!-- #include file="menu_04.inc" -->
          </ul>
        </li>

Přidal jsem CSS na daném breakpontu takto:

.navbar-default .container-fluid .navbar-collapse {
    max-height: initial;
    background-color: #008f3e;
.navbar-default .container-fluid {
    z-index: 100;
    position: absolute;

A potom už je vždycky <div class="row"> a v něm ještě další divy col-md-xx a zase vnořené divy, ale na tom už nesejde..

Potřebuji nějak obsah stránky posunout o výšku menu níž ale jen když je menu rozvinuté, logicky :)

 
Odpovědět
15.11.2015 18:37
Avatar
Odpovídá na Michal Kuba
Neaktivní uživatel:15.11.2015 19:38

A nedal jsi tomu menu absolutní, nebo fixní pozici (position: fixed)? :)

Nahoru Odpovědět
15.11.2015 19:38
Neaktivní uživatelský účet
Avatar
Michal Kuba
Tvůrce
Avatar
Odpovídá na Neaktivní uživatel
Michal Kuba:15.11.2015 20:19

No když tam mám absolutní jako teď tak to menu překryje část a potom když scrolluju tak se zbytek ukáže.. když dám fixní tak se ukáže jen část menu a navíc když scrolluju, tak se to vubec nehne, jen občas vidím, jak něco za tím menu projede..

 
Nahoru Odpovědět
15.11.2015 20:19
Avatar
Odpovídá na Michal Kuba
Neaktivní uživatel:16.11.2015 14:52

Já to myslel tak, že to position odstraníš úplně, popřípadě nastavíš defaultní hodnotu static...

Nahoru Odpovědět
16.11.2015 14:52
Neaktivní uživatelský účet
Avatar
Michal Kuba
Tvůrce
Avatar
Odpovídá na Neaktivní uživatel
Michal Kuba:16.11.2015 16:32

no on se ten problém táhl už s tím, že v jiných breakpointech měním atributy.. nejde nějak v CSS říct, že od tohoto breakpointu chci použít defaultní nastavení Bootstrapu a ne to z předchozího breakpointu? Díky

 
Nahoru Odpovědět
16.11.2015 16:32
Děláme co je v našich silách, aby byly zdejší diskuze co nejkvalitnější. Proto do nich také mohou přispívat pouze registrovaní členové. Pro zapojení do diskuze se přihlas. Pokud ještě nemáš účet, zaregistruj se, je to zdarma.

Zobrazeno 5 zpráv z 5.