Zdravím,
som ešte pomerne začiatočník vo wordperss-e. Chcel by som sa opýtať,ako by som mohol dodať k menu aj dodatočne tlačídka (FB,twitter,RSS), len neviem ako to urobit.
Teraz to vyzerá takto:
A takto to chcem:
[img=http://s12.postimg.org/kgw3s6pgp/Bez_n_zvu.jpg]+takto vyzerá kod:
Kód:
.menu-menu-container {
font-family: 'Ledger';
font-size: 15px;
position: relative;
top: 205px;
}
.menu{
background: rgb(255,255,255); /* Old browsers */
background: -moz-linear-gradient(top, rgba(255,255,255,1) 0%, rgba(241,241,241,1) 50%, rgba(225,225,225,1) 51%, rgba(246,246,246,1) 100%); /* FF3.6+ */
background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,rgba(255,255,255,1)), color-stop(50%,rgba(241,241,241,1)), color-stop(51%,rgba(225,225,225,1)), color-stop(100%,rgba(246,246,246,1))); /* Chrome,Safari4+ */
background: -webkit-linear-gradient(top, rgba(255,255,255,1) 0%,rgba(241,241,241,1) 50%,rgba(225,225,225,1) 51%,rgba(246,246,246,1) 100%); /* Chrome10+,Safari5.1+ */
background: -o-linear-gradient(top, rgba(255,255,255,1) 0%,rgba(241,241,241,1) 50%,rgba(225,225,225,1) 51%,rgba(246,246,246,1) 100%); /* Opera 11.10+ */
background: -ms-linear-gradient(top, rgba(255,255,255,1) 0%,rgba(241,241,241,1) 50%,rgba(225,225,225,1) 51%,rgba(246,246,246,1) 100%); /* IE10+ */
background: linear-gradient(to bottom, rgba(255,255,255,1) 0%,rgba(241,241,241,1) 50%,rgba(225,225,225,1) 51%,rgba(246,246,246,1) 100%); /* W3C */
filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#ffffff', endColorstr='#f6f6f6',GradientType=0 ); /* IE6-9 */
border-radius: 20px;
padding-left: 22px;
}
.menu li{
display: inline;
}
.menu ul{
margin: 0;
padding: 0;
display: block;
}
.menu .sub-menu{
display: none;
}
.menu a{
margin: 0;
padding: 10px;
cursor: pointer;
}
.menu a:hover,.menu a:active{
background: url('assets/menu.png');
color: white;
-moz-box-shadow: inset 0 0 10px black;
-webkit-box-shadow: inset 0 0 10px black;
box-shadow: inset 0 0 10px black;
transition:color 800ms ;
-moz-transition:color 800ms ; /* Firefox 4 */
-webkit-transition:color 800ms ; /* Safari and Chrome */
-o-transition:color 800ms ; /* Opera */
}
.menu li:hover ul {
position: absolute;
display: block;
margin-top: 10px;
padding:10px 22px;
}
.menu ul {
background: rgb(210,255,82); /* Old browsers */
background: -moz-linear-gradient(top, rgba(210,255,82,1) 0%, rgba(145,232,66,1) 100%); /* FF3.6+ */
background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,rgba(210,255,82,1)), color-stop(100%,rgba(145,232,66,1))); /* Chrome,Safari4+ */
background: -webkit-linear-gradient(top, rgba(210,255,82,1) 0%,rgba(145,232,66,1) 100%); /* Chrome10+,Safari5.1+ */
background: -o-linear-gradient(top, rgba(210,255,82,1) 0%,rgba(145,232,66,1) 100%); /* Opera 11.10+ */
background: -ms-linear-gradient(top, rgba(210,255,82,1) 0%,rgba(145,232,66,1) 100%); /* IE10+ */
background: linear-gradient(to bottom, rgba(210,255,82,1) 0%,rgba(145,232,66,1) 100%); /* W3C */
filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#d2ff52', endColorstr='#91e842',GradientType=0 ); /* IE6-9 */
border-radius: 20px
}
Snažil som sa to urobiť cez dodatočne div-i no akosi mi to nešlo...
za každu radu som vďačný..
