Menü umstruckturieren (vertikal vs. horizontal)

[andwinkler]

Auch heute versuche ich schon den ganzen Tag das neue phpbb3 anzupassen. Mal funxt was mal wieder nicht.

Es geht um folgendes. Die Menüs im folgenden würde ich gerne horizontal anordnen.

[ externes Bild ]
Shot at 2007-11-28

Code des CSS:

Code: Alles auswählen

/* Horizontal lists
----------------------------------------*/
ul.linklist {
	list-style-type: none;
	margin: 0;
}

ul.linklist li {
	display: block;
	list-style-type: none;
	margin-right: 0;
	font-size: 1.1em;
	line-height: 2.2em;
}

ul.linklist li.rightside, p.rightside {
	float: 0;
	margin-right: 0;
	margin-left: 0;
	text-align: 0;
}

ul.navlinks {
	padding-bottom: 1px;
	margin-bottom: 1px;
	border-bottom: 1px solid #FFFF00;
	font-weight: bold;
}

ul.leftside {
	float: left;
	margin-left: 15%;
	margin-right: 15px;
	text-align: left;
}

ul.rightside {
	float: right;
	margin-left: 5px;
	margin-right: -5px;
	text-align: right;
}

Code der overall_header:

Code: Alles auswählen

<div class="navbar"> <div class="test1">

			<!-- IF not S_IS_BOT and S_USER_LOGGED_IN -->
			<ul class="linklist leftside">
				<li class="icon-ucp">
					<a href="{U_PROFILE}" title="{L_PROFILE}" accesskey="u">{L_PROFILE}</a>
						<!-- IF S_DISPLAY_PM --> (<a href="{U_PRIVATEMSGS}">{PRIVATE_MESSAGE_INFO}</a>)<!-- ENDIF --> &bull; 
					<a href="{U_SEARCH_SELF}">{L_SEARCH_SELF}</a>
					<!-- IF U_RESTORE_PERMISSIONS --> &bull;
					<a href="{U_RESTORE_PERMISSIONS}">{L_RESTORE_PERMISSIONS}</a>
					<!-- ENDIF -->
				</li>
				<!-- ENDIF -->
				<li class="icon-faq"><a href="{U_FAQ}" title="{L_FAQ_EXPLAIN}">{L_FAQ}</a></li>
				<!-- IF not S_IS_BOT -->
					<!-- IF S_DISPLAY_MEMBERLIST --><li class="icon-members"><a href="{U_MEMBERLIST}" title="{L_MEMBERLIST_EXPLAIN}">{L_MEMBERLIST}</a></li><!-- ENDIF -->
					<!-- IF not S_USER_LOGGED_IN --><li class="icon-register"><a href="{U_REGISTER}">{L_REGISTER}</a></li><!-- ENDIF -->
					<li class="icon-logout"><a href="{U_LOGIN_LOGOUT}" title="{L_LOGIN_LOGOUT}" accesskey="l">{L_LOGIN_LOGOUT}</a></li>
				<!-- ENDIF -->
			</ul>
			<span class="corners-bottom"><span></span></span></div>
		</div>








<div id="navbar1">
			<div class="inner">
			<ul class="linklist navlinks">
				<li class="icon-home"><a href="{U_INDEX}" accesskey="h">{L_INDEX}</a><!-- BEGIN navlinks --> <strong>‹</strong> <a href="{navlinks.U_VIEW_FORUM}">{navlinks.FORUM_NAME}</a><!-- END navlinks --> </li>

				<li class="rightside"><a href="#" onclick="fontsizeup(); return false;" class="fontsize" title="{L_CHANGE_FONT_SIZE}">{L_CHANGE_FONT_SIZE}</a></li>

				<!-- IF U_EMAIL_TOPIC --><li class="rightside"><a href="{U_EMAIL_TOPIC}" title="{L_EMAIL_TOPIC}" class="sendemail">{L_EMAIL_TOPIC}</a></li><!-- ENDIF -->
				<!-- IF U_EMAIL_PM --><li class="rightside"><a href="{U_EMAIL_PM}" title="{L_EMAIL_PM}" class="sendemail">{L_EMAIL_PM}</a></li><!-- ENDIF -->
				<!-- IF U_PRINT_TOPIC --><li class="rightside"><a href="{U_PRINT_TOPIC}" title="{L_PRINT_TOPIC}" accesskey="p" class="print">{L_PRINT_TOPIC}</a></li><!-- ENDIF -->
				<!-- IF U_PRINT_PM --><li class="rightside"><a href="{U_PRINT_PM}" title="{L_PRINT_PM}" accesskey="p" class="print">{L_PRINT_PM}</a></li><!-- ENDIF -->
			</ul>
			<span class="corners-bottom"><span></span></span></div>
</div>

Ich schaff es zwar, die gesamte navigation rechts auszurichten und links, bezw. mit margin und padding ect. zu arbeiten. Jedoch wie kann ich daraus ein horizontales menü erstellen.


bitte um hilfe
und thx im vorraus

lg andwinkler

[andwinkler]

Habs gefunden, für all diejenigen die mal aufs gleiche Problem stoßen.

Mit dem befehl Display:inline; funktioniert das.

lg