Evo pomazem drugu da sredi forum, ali zaboli smo na jednoj stvari. Pokusavao sam sve u css-u, ali ni da makne :) Kako da postavim meni na sredini ?
(http://i.imgur.com/W0lmQ.png)
Pretpostavljam da si probao
text-align:center;
Ako nije problem daj celu klasu iz css ovde da pogledamo.
Quote from: Chupko on December 17, 2012, 07:42:57 PM
Evo pomazem drugu da sredi forum, ali zaboli smo na jednoj stvari. Pokusavao sam sve u css-u, ali ni da makne :) Kako da postavim meni na sredini ?
Ako sam dobro shvatio onda pogledaj:
http://www.simplemachines.org/community/index.php?topic=484159.msg3390702#msg3390702
http://www.simplemachines.org/community/index.php?topic=478288.msg3346416#msg3346416
http://www.simplemachines.org/community/index.php?topic=472007.msg3299228#msg3299228
http://www.simplemachines.org/community/index.php?topic=467919.msg3270541#msg3270541
http://www.simplemachines.org/community/index.php?topic=466784.msg3262112#msg3262112
@Carobnjak
/****TOP NAVIGATION***/
#top_navigation
{
text-align:center;
padding: 0;
float: left;
margin: 0 0 0 6px;
width: 100%;
position:relative;
}
#nav, #nav ul{
margin:0;
padding:0;
list-style-type:none;
list-style-position:outside;
position:relative;
line-height:1.5em;
z-index: 100;
}
/***child***/
#nav li ul li a:link, #nav li ul li a:active, #nav li ul li a:visited{
margin: 0;
padding:9px;
height:10px;
line-height: 5px;
border-top:none;
text-decoration: none;
}
#nav li ul li a:hover{
color: #222;
font-weight: bold;
font-size:11px;
z-index: 102;
position: relative;
-moz-box-shadow: 0 0 3px #999999;
-webkit-box-shadow: 0 0 3px #999999;
box-shadow: 0 0 3px #999999;
-moz-border-radius: 0px;
border-radius: 0px;
-webkit-border-radius:0px;
background: #2989D8; /* Old browsers */
background: -moz-linear-gradient(top, #2989D8 0%, #1E5799 94%); /* FF3.6+ */
background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,#2989D8), color-stop(94%,#1E5799)); /* Chrome,Safari4+ */
background: -webkit-linear-gradient(top, #2989D8 0%,#1E5799 94%); /* Chrome10+,Safari5.1+ */
background: -o-linear-gradient(top, #2989D8 0%,#1E5799 94%); /* Opera11.10+ */
background: -ms-linear-gradient(top, #2989D8 0%,#1E5799 94%); /* IE10+ */
filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#2989D8', endColorstr='#1E5799',GradientType=0 ); /* IE6-9 */
background: linear-gradient(top, #2989D8 0%,#1E5799 94%); /* W3C */
}
/***child end***/
#nav li a:link, #nav li a:active, #nav li a:visited{
background: none repeat scroll 0 0 transparent;
border-top: 1px solid #6189A7;
color: #6189A7;
display: block;
font-size: 11px;
font-weight: bold;
height: 34px;
line-height: 31px;
margin: -3px;
padding: 3px 13px;
text-decoration: none;
-moz-border-radius: 0px;
border-radius: 0px;
-webkit-border-radius: 0px;
}
#nav li a.active_button
{
color: #222;
font-weight: bold;
font-size:11px;
position: relative;
z-index: 102;
padding-left: 40px;
padding-right: 40px;
-moz-box-shadow: 1px 0 0px #000000;
-webkit-box-shadow: 1px 0 0px #000000;
box-shadow: 1px 0 0px #000000;
-moz-border-radius: 0px;
border-radius: 0px;
-webkit-border-radius:0px;
background: #2989D8; /* Old browsers */
background: -moz-linear-gradient(top, #2989D8 0%, #1E5799 94%); /* FF3.6+ */
background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,#2989D8), color-stop(94%,#1E5799)); /* Chrome,Safari4+ */
background: -webkit-linear-gradient(top, #2989D8 0%,#1E5799 94%); /* Chrome10+,Safari5.1+ */
background: -o-linear-gradient(top, #2989D8 0%,#1E5799 94%); /* Opera11.10+ */
background: -ms-linear-gradient(top, #2989D8 0%,#1E5799 94%); /* IE10+ */
filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#2989D8', endColorstr='#1E5799',GradientType=0 ); /* IE6-9 */
background: linear-gradient(top, #2989D8 0%,#1E5799 94%); /* W3C */
}
#nav li a:hover{
color: #222;
font-weight: bold;
font-size:11px;
z-index: 102;
position: relative;
-moz-border-radius: 0px;
border-radius: 0px;
-webkit-border-radius:0px;
-moz-box-shadow: 1px 0 0px #000000;
-webkit-box-shadow: 1px 0 0px #000000;
box-shadow: 1px 0 0px #000000;
background: #2989D8; /* Old browsers */
background: -moz-linear-gradient(top, #2989D8 0%, #1E5799 94%); /* FF3.6+ */
background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,#2989D8), color-stop(94%,#1E5799)); /* Chrome,Safari4+ */
background: -webkit-linear-gradient(top, #2989D8 0%,#1E5799 94%); /* Chrome10+,Safari5.1+ */
background: -o-linear-gradient(top, #2989D8 0%,#1E5799 94%); /* Opera11.10+ */
background: -ms-linear-gradient(top, #2989D8 0%,#1E5799 94%); /* IE10+ */
filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#2989D8', endColorstr='#1E5799',GradientType=0 ); /* IE6-9 */
background: linear-gradient(top, #2989D8 0%,#1E5799 94%); /* W3C */
}
#nav li{
float:left;
position:relative;
}
#nav ul {
position:absolute;
width:19em;
top:1.5em;
display:none;
margin-top: 16px;
background: #E9EEF2 url(../images/lgf/main_bg.png) repeat;
padding:5px;
border-bottom: 3px dashed #73A3C6;
border-left: 3px dashed #73A3C6;
border-right: 3px dashed #73A3C6;
z-index: 99;
}
#nav li ul a{
width:20em;
float:left;
margin: 0;
text-decoration: none;
}
#nav ul ul{
top:auto;
}
#nav li ul ul {
border-top: 3px dashed #73A3C6;
margin: 22px 45px;
z-index: 98;
}
#nav li:hover ul ul, #nav li:hover ul ul ul, #nav li:hover ul ul ul ul{
display:none;
}
#nav li:hover ul, #nav li li:hover ul, #nav li li li:hover ul, #nav li li li li:hover ul{
display:block;
}
/****TOP NAVIGATION END***/
/****CUSTOM TOP MENU****/
.top_menu
{
text-align:center;
padding: 0;
float: left;
margin: 0 0 0 6px;
width: 100%;
position:relative;
background: url("../images/lgf/top_navgation.jpg") repeat-x scroll center bottom transparent;
}
.top_menu_buttons
{
position: ;
}
div.menu_buttons
{
margin: 8px 5px 0 0;
float: center;
}
.menu_buttons a:hover
{
}
.menu_buttons a
{
color: #222;
font-weight: bold;
position: relative;
right: -4px;
text-decoration: none;
top: 6px;
margin: 0;
padding: 4px 5px 6px;
-moz-border-radius:2px;
-webkit-border-radius: 2px;
border-radius: 2px;
background: #fefaef;
background: -moz-linear-gradient(top, #fefaef 0%, #e6e3de 32%, #c0bfbd 64%, #bbbab8 67%, #a5a4a9 93%, #a3a2a7 94%, #a1a0a5 100%);
background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,#fefaef), color-stop(32%,#e6e3de), color-stop(64%,#c0bfbd), color-stop(67%,#bbbab8), color-stop(93%,#a5a4a9), color-stop(94%,#a3a2a7), color-stop(100%,#a1a0a5));
background: -webkit-linear-gradient(top, #fefaef 0%,#e6e3de 32%,#c0bfbd 64%,#bbbab8 67%,#a5a4a9 93%,#a3a2a7 94%,#a1a0a5 100%);
background: -o-linear-gradient(top, #fefaef 0%,#e6e3de 32%,#c0bfbd 64%,#bbbab8 67%,#a5a4a9 93%,#a3a2a7 94%,#a1a0a5 100%);
background: -ms-linear-gradient(top, #fefaef 0%,#e6e3de 32%,#c0bfbd 64%,#bbbab8 67%,#a5a4a9 93%,#a3a2a7 94%,#a1a0a5 100%);
filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#fefaef', endColorstr='#a1a0a5',GradientType=0 );
background: linear-gradient(top, #fefaef 0%,#e6e3de 32%,#c0bfbd 64%,#bbbab8 67%,#a5a4a9 93%,#a3a2a7 94%,#a1a0a5 100%);
}
.menu_buttons span:hover
{
background: #a90329;
background: -moz-linear-gradient(top, #a90329 0%, #8f0222 44%, #6d0019 100%);
background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,#a90329), color-stop(44%,#8f0222), color-stop(100%,#6d0019));
background: -webkit-linear-gradient(top, #a90329 0%,#8f0222 44%,#6d0019 100%);
background: -o-linear-gradient(top, #a90329 0%,#8f0222 44%,#6d0019 100%);
background: -ms-linear-gradient(top, #a90329 0%,#8f0222 44%,#6d0019 100%);
filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#a90329', endColorstr='#6d0019',GradientType=0 );
background: linear-gradient(top, #a90329 0%,#8f0222 44%,#6d0019 100%);
}
.menu_buttons span
{
color: #eee;
font-weight: bold;
position: relative;
text-decoration: none;
top: -5px;
margin: 5px;
padding: 0px 0px 8px 1px;
-moz-border-radius:2px;
-webkit-border-radius: 2px;
border-radius: 2px;
background: #0369a9;
background: -moz-linear-gradient(top, #0369a9 0%, #025a90 44%, #00446e 100%);
background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,#0369a9), color-stop(44%,#025a90), color-stop(100%,#00446e));
background: -webkit-linear-gradient(top, #0369a9 0%,#025a90 44%,#00446e 100%);
background: -o-linear-gradient(top, #0369a9 0%,#025a90 44%,#00446e 100%);
background: -ms-linear-gradient(top, #0369a9 0%,#025a90 44%,#00446e 100%);
filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#0369a9', endColorstr='#00446e',GradientType=0 );
background: linear-gradient(top, #0369a9 0%,#025a90 44%,#00446e 100%);
}
.menu_buttons span span
{
left: -3px;
margin: 0;
opacity: 0.5;
padding: 4px;
position: relative;
top: 6px;
background: transparent;
text-shadow:-1px 0 2px #222;
}
/*****CUSOM TOP MENU END*****/
Branko, ne pomaze nista. Videcu nekako da sredim :)
u index.template.php zamjeni cjelu funkciju function template_menu()
function template_menu()
{
global $context, $settings, $options, $scripturl, $txt;
echo '
<table style="margin:0 auto;">
<tbody>
<tr>
<td>
<div id="top_navigation">
<ul class="top_navigation_ul" id="nav">';
foreach ($context['menu_buttons'] as $act => $button) {
echo '
<li id="button_', $act, '" class="first_line">
<a class="', $button['active_button'] ? 'active_button' : '', '" href="', $button['href'],
'"', isset($button['target']) ? ' target="' . $button['target'] . '"' : '', '>
<span class="', isset($button['is_last']) ? '' : '', '">', $button['title'],
'</span>
</a>';
if (!empty($button['sub_buttons'])) {
echo '
<ul class="">';
foreach ($button['sub_buttons'] as $childbutton) {
echo '
<li>
<a href="', $childbutton['href'], '"', isset($childbutton['target']) ?
' target="' . $childbutton['target'] . '"' : '', '>
<span', isset($childbutton['is_last']) ? ' class="last"' : '', '>', $childbutton['title'],
!empty($childbutton['sub_buttons']) ? '...' : '', '</span>
</a>';
// 3rd level menus :)
if (!empty($childbutton['sub_buttons'])) {
echo '
<ul>';
foreach ($childbutton['sub_buttons'] as $grandchildbutton)
echo '
<li>
<a href="', $grandchildbutton['href'], '"', isset($grandchildbutton['target']) ?
' target="' . $grandchildbutton['target'] . '"' : '', '>
<span', isset($grandchildbutton['is_last']) ? ' class="last"' : '',
'>', $grandchildbutton['title'], '</span>
</a>
</li>';
echo '
</ul>';
}
echo '
</li>';
}
echo '
</ul>';
}
echo '
</li>';
}
echo '
</ul>
</div>
</td>
</tr>
</tbody>
</table>';
}
i u CSS zamjeni. nisam testirao moguće da visina neće odgovarati pa se poigraj sa parametrom top
#top_navigation {
border-bottom: 0 dashed #FFFFFF;
border-top: 0 dashed #FFFFFF;
position: relative;
top: -9px;
}