CSS chyby a nesrovnalosti ve Firefoxu 3.x

Neexistuje mnoho článků, které by pokrývaly neslučitelnosti, nebo CSS rozdíly ve Firefoxu samotném - a z dobrého důvodu.

Firefox se vždycky skvěle staral o to, aby podporoval jak CSS, tak i JavaScript v souladu s normami, aniž by bylo příliš mnoho nepříjemných chyb.

Existuje však několik vlastností a voličů CSS, které nejsou podporovány jednou nebo více verzemi uvolněnými od verze 3.0, které zde pokryji.

Tento článek bude obsahovat chyby, nesrovnalosti a nepodporování . Takže pokud máte potíže s vlastností nebo volbou CSS ve Firefoxu a není zde uvedena, pravděpodobně budete muset přehodnotit rozvržení a znovu zvážit, co může být viníkem.

Vzhledem k tomu, že Firefox 2 je prakticky neexistující , Tuto verzi konkrétně nebudou zvažovat, ale tyto informace se ve výchozím nastavení vztahují na tuto verzi.

A musím poznamenat, že materiál pro tento post byl převzat především z nově aktualizované SitePoint CSS reference , což je nejlepší a nejobsáhlejší odkaz CSS dostupný kdekoli.

Chyba přetečení obrysu

Ve Firefoxu 3.x, když prvek přetéká okraj rodiče, který má outline sadu vlastností, obrys se natáhne tak, aby odpovídal obsahu prvku, jak je znázorněno na snímku obrazovky níže:

Správná implementace se zobrazuje v dalším snímání obrazovky převzatém z Chromu:

Jak je uvedeno výše, obrys by měl zahrnovat element, který je načrtnut a neměl by být ovlivněn žádnými přetečkami. Aby nedošlo k záměně, poznamenat, že se jedná o chybu při implementaci outline vlastnost, nikoliv border vlastnictví.

Odkaz: Reference SitePoint CSS: Vlastnost náčrtu

Tabulky se sbalenými hranicemi

Ve Firefoxu, kdy je tabulka nastavena na hranice collapse za použití border-collapse vlastnost, horní a levé okraje tabulky ve vztahu k blízkým prvkům jsou 1 pixel vypnuty. Toto je zobrazeno na zvětšeném snímku obrazovky na obrázku níže, který zobrazuje dolní okraj prvku na úrovni bloku (červený), který se dotýká horního okraje sbaleného tabulky (modrý):

Zde je správná implementace tohoto páru vlastností / hodnot, jak je zobrazeno v prohlížeči Chrome:

Jak je uvedeno výše, protože hranice jsou "sbalené" a protože tabulka není blokovým prvkem, měl by být v levém okraji malý posun a horní okraj by měl být dokonce i se spodním okrajem prvku nad ním.

Odkaz: Reference SitePoint CSS: vlastnost sblížení okrajů

Vyprázdněte buňky v řádcích tabulky

Toto je hodnota vlastností, která není správně implementována žádným prohlížečem, včetně prohlížeče Firefox. Pokud řádek tabulky nemá žádný viditelný obsah a všechny její buňky mají své empty-cells vlastnost nastavena na hide , celý řádek by se měl chovat tak, jako kdyby byl nastaven na hodnotu "zobrazit: žádný", aniž by byly viditelné žádné hranice nebo pozadí.

Žádný prohlížeč nepracuje správně, takže řádek tabulky je stále viditelný, jak je znázorněno na následujícím obrázku.

Odkaz: Reference SitePoint CSS: Vlastnosti prázdných buněk

Rozpoznávání slov na elementy Inline

Ve Firefoxu 3.x je záporná hodnota na word-spacing vlastnost bude považována za nulovou na sousedních inline prvcích. Záporná hodnota by měla způsobit vzájemné překrývání vložených prvků, jako by tomu bylo u textu, ale nestane se tak. Namísto toho jsou elementům přiděleny nulové rozdělení bílých prostor bez překrytí.

Obrázek níže zobrazuje správné i nesprávné implementace:

V příkladech uvedených výše jsou tři slova "ovoce", "zelenina" a "ostatní potraviny" jednotlivě zabalena do prvky, zatímco odstavec, který je obtéká, má své word-spacing vlastnost nastavená na zápornou hodnotu.

Druhý příklad (Firefox) se nepoužívá k oddálení negativních slov, s výjimkou posledních dvou slov, protože tato slova nejsou jednotlivě zabalena s rozpětím, ale jsou přirozenými textovými prvky.

Jako vedlejší bod se tato chyba vyskytuje podobně v IE8, ale ne v předchozích verzích IE.

Odkaz: SitePoint CSS Reference: Vlastnost mezery slov

Textová dekorace na plávajících potomcích

Pokud má prvek nastavenou hodnotu dekorace textu, tato hodnota by neměla být dědictvím pohyblivých potomků. V prohlížeči Firefox 3.x mají plovoucí potomci stejnou hodnotu jako jejich rodiče, ačkoli tomu tak není.

Na výše uvedeném obrázku je první řádek snímek obrazovky z IE8 zobrazující a prvek vznášel uvnitř kotvy. Text uvnitř nemá viditelnou textovou výzdobu, což je správný způsob zobrazení. Ve Firefoxu (zobrazeném ve druhém příkladu) je textová dekorace nesprávně aplikována na plovoucí .

Možná jste si všimli této chyby ve Firefoxu, když se pokoušíte odstranit textovou výzdobu z plovoucích obrazů uvnitř kotvících prvků.

Odkaz: SitePoint CSS Reference: vlastnost dekorace textu

pre-line & pre-wrap pro vlastnost white-space ve FF 3.0

Za použití white-space vlastnost v aplikaci Firefox 3.5 můžete určit, zda se má více místů zkopírovat do jednoho místa nebo ne. Ve výchozím nastavení dokumenty HTML sblíží více míst do jednoho místa. V některých případech můžete použít white-space: pre aby se zabránilo sbalení bílého místa, což je podobné použití

  HTML tag.  Následně můžete toto nastavení odstranit pomocí white-space:  pre-line  (aby se zbavil bílého místa). 
  Firefox 3.0 nepodporuje tuto hodnotu, takže bude zachován bílý prostor.  Aplikace Firefox 3.5 správně zkolabuje.  Obrázek níže ukazuje oba příklady: 
  Stejně tak, když je nastaven text odstavce white-space:  pre-wrap  , mělo by to chránit bílé mezeru mezi slovy, ale samozřejmě by mělo zahrnovat přerušování řádků.  Firefox 3.0 se nepodaří tuto funkci implementovat správně, zatímco pozdější verze (a všechny ostatní prohlížeče) obsahují přírodní linky.  Oba příklady jsou uvedeny níže. 
  Mějte na paměti, že je uveden vnější prvek white-space: pre  zatímco vnitřní   se snaží překonat nedostatek přerušení řádků pomocí pre-wrap  .  Samotný, pre-wrap  by neměl žádný účinek. 
  Firefox 3.x také zachází s některými white-space  hodnoty odlišně od jiných prohlížečů, když jsou tyto hodnoty aplikovány na </code>  živel.  Například při použití <code>white-space:  nowrap</code>  by měl způsobit, že všechny napsané texty jsou v <code><textarea></code>  vytvořit jeden řádek, ale Firefox 3.x to neudělá. </p><p>  <strong>Odkaz:</strong> <a href="http://reference.sitepoint.com/css/white-space" class=external rel=nofollow>Reference SitePoint CSS: Vlastnost white-space</a></p><ul></ul><p class=clearrow></p><h2>  Vlastnosti přerušení stránky </h2><p>  CSS umožňuje vývojářům určit, kde by se měly nebo neměly objevit stránky pomocí tří vlastností <code>page-break-before</code>  , <code>page-break-inside</code>  , a <code>page-break-after</code>  .  Opera je jediný prohlížeč, který tyto vlastnosti plně podporuje, zatímco jiné prohlížeče nabízejí částečnou podporu nebo žádnou podporu. </p><p>  The <code>page-break-inside</code>  vlastnost určuje, zda může dojít k přerušení stránky uvnitř jednoho prvku na úrovni bloku.  Firefox tuto službu nepodporuje.  Použití syntaxe <code>page-break-inside:  avoid</code>  , můžete zabránit rozdělení prvku během tisku.  Níže uvedený obrázek z náhledu tisku v aplikaci Opera 10 ukazuje, jak může tato vlastnost zabránit rozdělení neřízeného seznamu na dvě stránky: </p><div class=article-large-block><img src="https://odwebdesign.net/uploads/c/d1/22/css-bugs-and-inconsistencies-in-firefox-3-x_10.gif" alt="" width=615 height=293 /></div><p>  Naopak, podívejte se na obrázek níže, převzatý z volby Náhled náhledu v aplikaci Firefox 3.5: </p><div class=article-large-block><img src="https://odwebdesign.net/uploads/9/18/ac/css-bugs-and-inconsistencies-in-firefox-3-x_11.gif" alt="" width=615 height=278 /></div><p>  <strong>Odkaz:</strong> <a href="http://reference.sitepoint.com/css/pagedmedia" class=external rel=nofollow>SitePoint CSS Reference: Vlastnosti stránkovaného média</a></p><ul></ul><p class=clearrow></p><h2>  Siroty a vdovy na stránkách pro tisk </h2><p>  The <code>orphans</code>  a <code>widows</code>  Vlastnosti CSS jsou podporovány pouze aplikacemi Internet Explorer 8 a Opera od verze 9. Tato vlastnost slouží k zadání minimálního počtu řádků z jednoho odstavce, které se mohou vyskytnout na vytištěné stránce v dolní části (sirotky) nebo v horní části (vdovy ).  V závislosti na zvoleném čísle budou čáry přesunuty z jedné stránky na další (nebo předchozí), aby se zabránilo tisku jednoho řádku v horní nebo dolní části stránky. </p><p>  Dokonce i s <code>orphans</code>  vlastnost nastavená na hodnotu "3", jak je znázorněno na obrázku níže, Náhled tisku prohlížeče Firefox zobrazuje jeden řádek ve spodní části stránky, kterou lze tisknout: </p><div class=article-large-block><img src="https://odwebdesign.net/uploads/e/d0/f4/css-bugs-and-inconsistencies-in-firefox-3-x_12.gif" alt="" width=615 height=162 /></div><p>  Podobně jako <code>page-break-inside</code>  vlastnost Firefox také nepodporuje hodnoty <code>avoid</code>  , <code>left</code>  , a <code>right</code>  pro oba <code>page-break-before</code>  a <code>page-break-after</code>  vlastnosti. </p><p>  <strong>Reference:</strong> <a href="http://reference.sitepoint.com/css/orphans" class=external rel=nofollow>Reference SitePoint CSS: vlastnictví sirotků</a>  | <a href="http://reference.sitepoint.com/css/widows" class=external rel=nofollow>Reference SitePoint CSS: Vlastnosti vdov</a></p><ul></ul><p class=clearrow></p><h2>  Prvotřídní chyba pseudo-elementu </h2><p>  The <code>:first-line</code>  pseudo-element umožňuje, aby první řádek libovolného textového bloku měl odlišné formátování od zbytku textu.  Například první řádek textu odstavce lze změnit na velká nebo na jinou barvu.  Aby tento prvek CSS pracoval prakticky, měl by umožnit možnost vnořených prvků na úrovni bloku.  Například a <code><div></code>  element, který obsahuje a <code><p></code>  element by měl povolit <code>:first-line</code>  pseudo-element pro změnu stylu prvního řádku textu uvnitř <code><div></code>  .  Ve Firefoxu (a v mnoha jiných prohlížečích) to není možné, pokud pseudo-element necílí specificky podřízený odstavec. </p><p>  Aplikace Internet Explorer 8, Chrome a Safari implementují tuto funkci správně a brání tomu, aby hnízdění blokových prvků přerušilo styl, jak je znázorněno na následujícím obrázku: </p><div class=article-large-block><img src="https://odwebdesign.net/uploads/1/82/8f/css-bugs-and-inconsistencies-in-firefox-3-x_13.gif" alt="" width=615 height=249 /></div><p>  V předchozím odstavci je text uvnitř a <code><p></code>  element, který se nachází uvnitř a <code><div></code>  .  The <code><p></code>  má <code>:first-line</code>  pseudo-element nastaven na <code>color:  blue</code>  , který v aplikaci Firefox selže kvůli vložení odstavce uvnitř <code><div></code>  . </p><p>  <strong>Odkaz:</strong> <a href="http://reference.sitepoint.com/css/pseudoelement-firstline" class=external rel=nofollow>SitePoint CSS Reference: první-line pseudo-element</a></p><ul></ul><p class=clearrow></p><h2>  Podpora CSS3 ve Firefoxu 3.x </h2><p>  Firefox postupně přidal lepší podporu pro CSS3 od vydání verze 3.0.  Níže je popis, jak Firefox zpracovává různé funkce CSS3.  Některé z nich mohou být stále v <a href="http://www.w3.org/Consortium/Process/Process-19991111/tr.html#RecsWD" class=external rel=nofollow>pracovní návrh</a>  nebo <a href="http://www.w3.org/Consortium/Process/Process-19991111/tr.html#RecsCR" class=external rel=nofollow>kandidátské doporučení</a>  fáze, proto nemůžeme být dogmatickí o tom, co by mělo a mělo by být podporováno, dokud nedosáhnou <a href="http://www.w3.org/Consortium/Process/Process-19991111/tr.html#RecsW3C" class=external rel=nofollow>doporučení</a>  etapa. </p><ul><li>  Firefox 3.0 nepodporuje <code>text-shadow</code>  vlastnictví </li><li>  Firefox 3.x nepodporuje <code>box-shadow</code>  vlastnictví, s výjimkou použití vlastního prefixu <code>-moz-</code></li><li>  Firefox 3.x nepodporuje <code>box-sizing</code>  vlastnictví, s výjimkou použití vlastního prefixu <code>-moz-</code></li><li>  Firefox 3.x nepodporuje více sloupců, pokud vlastní prefix <code>-moz-</code>  se používá </li><li>  Firefox 3.0 a 3.5 nepodporují gradienty CSS3 a vícenásobné pozadí (oba byly nedávno přidány v 3.6) </li><li>  Firefox 3.0 nepodporuje <code>border-image</code>  vlastnost, ale 3.5 ji podporuje pomocí <code>-moz-</code>  vlastní prefix </li><li>  Firefox 3.0 nepodporuje počet pseudotříd CSS3 (: nth-child,: nth-last-child, n-th-type atd.) </li><li>  Firefox 3.0 nepodporuje transformace CSS </li><li>  Firefox 3.x nepodporuje přechody CSS </li><li>  Firefox 3.x nepodporuje animace CSS </li></ul><p class=clearrow></p><h2>  Jiné funkce CSS nejsou podporovány </h2><p>  Některé z významnějších chyb a neslučitelností byly diskutovány výše, ale je třeba si uvědomit několik dalších. </p><ul><li>  Firefox až do verze 3.5 tuto hodnotu nepodporuje <code>run-in</code>  pro <code>display</code>  vlastnictví </li><li>  Firefox nepodporuje <code>::selection</code>  pseudo-element </li><li>  Firefox nepodporuje @page at-rule </li><li>  Pravidlo @ font-face at-rule není podporováno Firefoxem 3.0 </li></ul><p class=clearrow></p><h2>  Závěr </h2><p>  Poté, co jste prošli tímto materiálem, můžete jasně vidět, že <strong>nedostatek podpory funkcí CSS ve Firefoxu je minimální a v mnoha případech zcela nerelevantní,</strong> protože mnohé z zde diskutovaných vlastností nejsou příliš často používány. </p><p>  Nicméně doufám, že to bude slušným odkazem na nejvýznamnější chyby a nejednotnosti ve Firefoxu.  Pokud máte potíže s určitou funkcí CSS ve Firefoxu, která zde není uvedena, pravděpodobně děláte něco špatně nebo nemusí plně porozumět jistým koncepcím a zásadám CSS. </p><p>  Takže v tomto ohledu by tento odkaz <strong>měl fungovat dobře jako zpětný odkaz</strong> , protože ty, které zde nejsou uvedeny, mohou být důvěryhodné, aby fungovaly dobře, pokud jsou správně implementovány správnou syntaxí. </p><p>  Samozřejmě, pokud je něco, co mi chybělo, nebo nějaké chyby, prosím, vyjádřete svůj komentář a udělám vše pro to, abyste provedli potřebné opravy a doplňky. </p><p class=clearrow></p><h2>  Další odkazy </h2><ul class=tight_list><li><a href="https://developer.mozilla.org/En/CSS_improvements_in_Firefox_3" class=external rel=nofollow>Vylepšení CSS ve Firefoxu 3</a></li><li><a href="https://developer.mozilla.org/En/Firefox_3.5_for_developers#Newly-supported_CSS_features" class=external rel=nofollow>Nově podporované funkce CSS ve Firefoxu 3.5</a></li></ul><p><br class=spacer_ /></p><p>  <em>Firefox Image poskytl</em> <em><a rel=nofollow href="http://rakaz.nl/2004/10/firefox-wallpapers.html" class=external></em>  <em>Rakaz</em></a> <em><br class=spacer_ /></em> </p><p>  <em>Tento příspěvek byl napsán výhradně pro Webdesigner Depot Louis Lazaris, nezávislý spisovatel a webový vývojář.</em>  <em>Louis běží</em> <em><a rel=nofollow href="http://www.impressivewebs.com/" class=external></em>  <em>Působivé weby</em></a>  <em>kde on posílá články a cvičení na web designu.</em>  <em>Můžete sledovat Louis</em> <em><a rel=nofollow href="http://twitter.com/ImpressiveWebs" class=external></em>  <em>na Twitteru</em></a>  <em>nebo se s ním spojte</em> <em><a rel=nofollow href="http://www.impressivewebs.com/contact" class=external></em>  <em>přes jeho webové stránky</em></a>  <em>.</em> </p><p><br class=spacer_ /></p>


        <div class="bootstrap-tagsinput">
                        <span class="tag label label-info"><a href="https://cs.odwebdesign.net/tag/css/">css</a> </span>
                        <span class="tag label label-info"><a href="https://cs.odwebdesign.net/tag/firefox/">Firefox</a> </span>
                        <span class="tag label label-info"><a href="https://cs.odwebdesign.net/tag/hmyz/">hmyz</a> </span>
                        <span class="tag label label-info"><a href="https://cs.odwebdesign.net/tag/css-chyby/">css chyby</a> </span>
                        <span class="tag label label-info"><a href="https://cs.odwebdesign.net/tag/firefox-3/">firefox 3</a> </span>
                        <span class="tag label label-info"><a href="https://cs.odwebdesign.net/tag/chyby-firefoxu/">chyby firefoxu</a> </span>
                        <span class="tag label label-info"><a href="https://cs.odwebdesign.net/tag/nesrovnalosti/">nesrovnalostí</a> </span>
                    </div>
    </div>
</div>
<div class="row">
    <div class="col-md-12">
        <ul class="pager">
            
            <li class="previous"><a href="https://cs.odwebdesign.net/fight-div-itis-and-class-itis-with-the-960-grid-system/">← Bojujte s Divizím Itis a Class-Itis se systémem 960 Grid</a></li>            
            <li class="next"><a href="https://cs.odwebdesign.net/wordpress-vs-expressionengine-apples-and-oranges/">WordPress Vs.  ExpressionEngine: Jablka a pomeranče? →</a></li>        </ul>
    </div>
</div>



                                                                
            </div>
                <div class="col-md-3">
                                        <aside class="col-lg-12 side-bar col-md-12">
    <ul class="nav nav-tabs">
        <li class="active"> <a data-toggle="tab" href="#latest" role="tab">Nejnovější</a> </li>
        <li> <a data-toggle="tab" href="#popular" role="tab">Nejlepší</a> </li>
    </ul>

    <!-- Tab panes -->
    <div class="tab-content sidebar-tabing" id="nav-tabContent">
        <div class="tab-pane active" id="latest" role="tabpanel">
            
                        <div class="media"> <a href="https://cs.odwebdesign.net/4-cutting-edge-technologies-to-speed-up-your-sites/"> <img class="pull-left" style="margin-top: 10px; margin-left: 3px" src="https://odwebdesign.net/uploads//titles/4/97/81/4-cutting-edge-technologies-to-speed-up-your-sites_ors.jpg" alt=""></a>
                <div class="media-body">
                    <div class="title-small-sidebar">
                        <a href="https://cs.odwebdesign.net/4-cutting-edge-technologies-to-speed-up-your-sites/">4 technologie Cutting-Edge pro urychlení vašich stránek</a>
                    </div>
                </div>
            </div>
                        <div class="media"> <a href="https://cs.odwebdesign.net/9-reasons-hand-coding-always-beats-site-builders/"> <img class="pull-left" style="margin-top: 10px; margin-left: 3px" src="https://odwebdesign.net/uploads//titles/d/6b/ed/9-reasons-hand-coding-always-beats-site-builders_ors.jpg" alt=""></a>
                <div class="media-body">
                    <div class="title-small-sidebar">
                        <a href="https://cs.odwebdesign.net/9-reasons-hand-coding-always-beats-site-builders/">9 důvodů Ruční kódování vždy překonává stavitele stránek</a>
                    </div>
                </div>
            </div>
                        <div class="media"> <a href="https://cs.odwebdesign.net/zurb-launches-new-mention-engine-tribute-js/"> <img class="pull-left" style="margin-top: 10px; margin-left: 3px" src="https://odwebdesign.net/uploads//titles/b/1d/1a/zurb-launches-new-mention-engine-tribute-js_ors.jpg" alt=""></a>
                <div class="media-body">
                    <div class="title-small-sidebar">
                        <a href="https://cs.odwebdesign.net/zurb-launches-new-mention-engine-tribute-js/">Zurb uvádí nový @Mention Engine, Tribute.Js</a>
                    </div>
                </div>
            </div>
                        <div class="media"> <a href="https://cs.odwebdesign.net/how-to-ensure-mailchimp-emails-actually-reach-your-users/"> <img class="pull-left" style="margin-top: 10px; margin-left: 3px" src="https://odwebdesign.net/uploads//titles/4/49/d5/how-to-ensure-mailchimp-emails-actually-reach-your-users_ors.jpg" alt=""></a>
                <div class="media-body">
                    <div class="title-small-sidebar">
                        <a href="https://cs.odwebdesign.net/how-to-ensure-mailchimp-emails-actually-reach-your-users/">Jak zajistit, aby e-maily služby MailChimp skutečně oslovily uživatele</a>
                    </div>
                </div>
            </div>
                    </div>
        <div class="tab-pane" id="popular" role="tabpanel">
            
                            <div class="media"> <a href="https://cs.odwebdesign.net/the-virgin-atlantic-airways-blog-a-case-study/"> <img class="pull-left" src="https://odwebdesign.net/uploads//noima.jpg" alt=""></a>
                    <div class="media-body">
                        <div class="title-small-sidebar">
                            <a href="https://cs.odwebdesign.net/the-virgin-atlantic-airways-blog-a-case-study/">Blog Virgin Atlantic Airways: Případová studie</a>
                        </div>
                    </div>
                </div>
                            <div class="media"> <a href="https://cs.odwebdesign.net/youre-failing-as-a-web-developer-and-heres-why/"> <img class="pull-left" src="https://odwebdesign.net/uploads//noima.jpg" alt=""></a>
                    <div class="media-body">
                        <div class="title-small-sidebar">
                            <a href="https://cs.odwebdesign.net/youre-failing-as-a-web-developer-and-heres-why/">Chystáte se jako vývojář webu - a tady je důvod</a>
                        </div>
                    </div>
                </div>
                            <div class="media"> <a href="https://cs.odwebdesign.net/fight-div-itis-and-class-itis-with-the-960-grid-system/"> <img class="pull-left" src="https://odwebdesign.net/uploads//noima.jpg" alt=""></a>
                    <div class="media-body">
                        <div class="title-small-sidebar">
                            <a href="https://cs.odwebdesign.net/fight-div-itis-and-class-itis-with-the-960-grid-system/">Boj proti divizi a třídě-itis se systémem 960 mřížky</a>
                        </div>
                    </div>
                </div>
                            <div class="media"> <a href="https://cs.odwebdesign.net/css-bugs-and-inconsistencies-in-firefox-3-x/"> <img class="pull-left" src="https://odwebdesign.net/uploads//noima.jpg" alt=""></a>
                    <div class="media-body">
                        <div class="title-small-sidebar">
                            <a href="https://cs.odwebdesign.net/css-bugs-and-inconsistencies-in-firefox-3-x/">CSS chyby a nesrovnalosti ve Firefoxu 3.x</a>
                        </div>
                    </div>
                </div>
                    </div>
    </div>
</aside>
    
                                        
                                    </div>

            
        </div>
                <footer class="footer-bs">
            <div class="row">
                <div class="col-md-3 footer-brand animated fadeInLeft">
                    <img src="https://cs.odwebdesign.net/img/logo1n.png">
                                                        </div>


                <div class="col-md-9 footer-nav animated fadeInRight">
                    <ul class="list">
                        <li><a href="https://cs.odwebdesign.net/category/freebies/">Freebies</a></li>
                        <li><a href="https://cs.odwebdesign.net/category/interactive-design/">Interaktivní design</a></li>
                        <li><a href="https://cs.odwebdesign.net/contact_us/">Kontaktujte nás</a> </li>
                    </ul>
                    <br>
                    <h4>OdWebDesign.Net</h4>
                </div>
            </div>

            
                <!-- Piwik -->
                <script type="text/javascript">
                    var _paq = _paq || [];
                    /* tracker methods like "setCustomDimension" should be called before "trackPageView" */
                    _paq.push(['trackPageView']);
                    _paq.push(['enableLinkTracking']);
                    (function() {
                        var u="//odwebdesign.net/";
                        _paq.push(["setTrackerUrl", u+"piwik.php"]);
                        _paq.push(["setSiteId", "470"]);
                        var d=document, g=d.createElement("script"), s=d.getElementsByTagName("script")[0];
                        g.type="text/javascript"; g.async=true; g.defer=true; g.src=u+"piwik.php"; s.parentNode.insertBefore(g,s);
                    })();
                </script>
                <!-- End Piwik Code -->
            

        </footer>
    </div><!-- /.container -->

      
    <!-- Bootstrap core JavaScript
    ================================================== -->
    <!-- Placed at the end of the document so the pages load faster -->
    <script src="https://ajax.googleapis.com/ajax/libs/jquery/1.12.4/jquery.min.js"></script>
    <script src="/dist/js/bootstrap.min.js"></script>
  </body>
</html>