Diskuze: Menu

HTML a CSS HTML a CSS Menu American English version English version

Avatar
Amomym
Člen
Avatar
Amomym:

Ahoj, dělám menu a nevím jak udělat aby se ikony vycentrovaly na střed.

nav#menu {
        position: fixed;
        left: 0;
        top: 0;
        width: 100%;
        height: 35px;
        z-index: 200;
        background: #f9f9f9;
        padding: 15px;
        border-bottom: 1px solid #dcdcdc;

}

nav#menu ul {
        margin: 0px auto;
        list-style: none;
}

nav#menu ul li {
        float: left;
        margin-right: 5px;
  margin: 0px auto;
}

nav#menu ul li a {
        color: #999;
        text-decoration: none;
        font: 100 1.2em "Open Sans", sans-serif;
        display: block;
        padding: 5px 20px;
        -webkit-border-radius: 25px;
        -moz-border-radius: 25px;
        border-radius: 25px;

}

nav#menu ul li a:hover {
        background: none;
        color: #000;
}

nav#menu ul li a.active {
        background: #f9f9f9;
        background: url('data:image/svg+xml;base64,PD94bWwgdmVyc2lvbj0iMS4wIiA/Pgo8c3ZnIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyIgd2lkdGg9IjEwMCUiIGhlaWdodD0iMTAwJSIgdmlld0JveD0iMCAwIDEgMSIgcHJlc2VydmVBc3BlY3RSYXRpbz0ibm9uZSI+CiAgPGxpbmVhckdyYWRpZW50IGlkPSJncmFkLXVjZ2ctZ2VuZXJhdGVkIiBncmFkaWVudFVuaXRzPSJ1c2VyU3BhY2VPblVzZSIgeDE9IjAlIiB5MT0iMCUiIHgyPSIwJSIgeTI9IjEwMCUiPgogICAgPHN0b3Agb2Zmc2V0PSIwJSIgc3RvcC1jb2xvcj0iI2Y5ZjlmOSIgc3RvcC1vcGFjaXR5PSIxIi8+CiAgICA8c3RvcCBvZmZzZXQ9IjEwMCUiIHN0b3AtY29sb3I9IiNkZGRkZGQiIHN0b3Atb3BhY2l0eT0iMSIvPgogIDwvbGluZWFyR3JhZGllbnQ+CiAgPHJlY3QgeD0iMCIgeT0iMCIgd2lkdGg9IjEiIGhlaWdodD0iMSIgZmlsbD0idXJsKCNncmFkLXVjZ2ctZ2VuZXJhdGVkKSIgLz4KPC9zdmc+');
        background: -moz-linear-gradient(top,  #f9f9f9 0%, #dddddd 100%); /* FF3.6+ */
        background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,#f9f9f9), color-stop(100%,#dddddd)); /* Chrome,Safari4+ */
        background: -webkit-linear-gradient(top,  #f9f9f9 0%,#dddddd 100%); /* Chrome10+,Safari5.1+ */
        background: -o-linear-gradient(top,  #f9f9f9 0%,#dddddd 100%); /* Opera 11.10+ */
        background: -ms-linear-gradient(top,  #f9f9f9 0%,#dddddd 100%); /* IE10+ */
        background: linear-gradient(top,  #f9f9f9 0%,#dddddd 100%); /* W3C */
        filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#f9f9f9', endColorstr='#dddddd',GradientType=0 ); /* IE6-8 */
        color: #000;
        border: 1px solid #dcdcdc;
        box-shadow: inset 0 0 1px #fff;
}

nav#menu ul li a img.menuIcon {
        display: none;
  margin: 0px auto;
}

#wrapper {
        width: 900px;
        margin: 0 auto;
}

#page {
        text-align: left;
}

#neviditelny  {
        height: 80px;
}

toto je kód který mám ve style.css, čili desingt webu. Od vás bych teda chtěl vědět jaky script dát na vycentrování ikon na střed

 
Odpovědět 20.3.2013 21:29
Avatar
Honza Bittner
Redaktor
Avatar
Honza Bittner:

za 1. .. na co máš id menu ? :)

když máš nav tak mu nedělej id .. ;)
nav použiješ 1x na stránce ... takže zbytečné ...

potom sem dej nějaký náhled abychom viděli jak to máš udělané :)

např přes http://prntscr.com/

Nahoru Odpovědět 20.3.2013 21:38
Ptejte se mě na cokoli na https://github.com/HoBi/ama a followujte mě na Twitteru https://twitter.com/tenhobi. :-)
Avatar
Amomym
Člen
Avatar
Amomym:

http://prntscr.com/x4gh7 toto je odkaz na to jak to vypadá teď a chtěl bych aby ty ikony v menu, aby byly na středu stránky

 
Nahoru Odpovědět 20.3.2013 21:46
Avatar
Honza Bittner
Redaktor
Avatar
Odpovídá na Amomym
Honza Bittner:

OK, dáš do

nav ul
{
  margin: 0px auto;
}

mělo by to jít

Nahoru Odpovědět 20.3.2013 21:49
Ptejte se mě na cokoli na https://github.com/HoBi/ama a followujte mě na Twitteru https://twitter.com/tenhobi. :-)
Avatar
Amomym
Člen
Avatar
Odpovídá na Honza Bittner
Amomym:

nejde to, udělal jsem jak jsi napsal, ale nic se nestalo

 
Nahoru Odpovědět 20.3.2013 21:53
Avatar
Honza Bittner
Redaktor
Avatar
Odpovídá na Amomym
Honza Bittner:

tak nastav

nav ul li
{
 width: auto;
}

mohlo by to pomoc

Nahoru Odpovědět 20.3.2013 21:54
Ptejte se mě na cokoli na https://github.com/HoBi/ama a followujte mě na Twitteru https://twitter.com/tenhobi. :-)
Avatar
Honza Bittner
Redaktor
Avatar
Honza Bittner:

ještě dej

nav ul
{
  width: 300px;
}
Nahoru Odpovědět 20.3.2013 21:59
Ptejte se mě na cokoli na https://github.com/HoBi/ama a followujte mě na Twitteru https://twitter.com/tenhobi. :-)
Avatar
Amomym
Člen
Avatar
Odpovídá na Honza Bittner
Amomym:

už to mám, akorád jsem musel dát

nav ul
{
  width: 400px;
}
 
Nahoru Odpovědět 20.3.2013 22:06
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 8 zpráv z 8.