(gelöst) fehlerhafte Darstellung im index

[Helmut]

Hallo Overhead,

ja, das könnte schon sein, zeige doch mal eine ganze Seite wo das Forum drinnen ist oder gib einen Link zum Forum an wenn es Online ist, damit ich das mal selber live anschauen kann.

Wenn du das Portal sowieso nicht verwenden willst, dann nimm es raus, ist eine Fehlerquelle weniger.

Gruß Helmut

[Overhead]

Hallo Helmut,

hier ein Bild, volle Breite des Forums (es wird nicht im Portal angezeigt!)

[ externes Bild ]

Ansicht wenn man das Forum mit IE 7 aufruft.

[ externes Bild ]

Ansicht wenn Forum mit Opera aufgerufen wird.

cu Overhead

[Helmut]

Hallo Overhead,

ich habe noch einmal etwas rumgespielt, es liegt nicht an die, sondern an der Bildschirmauflösung und wie der IE damit umgeht. Es ist ein generelles Problem liegt in den Klassen rightside und leftside und in den div, da werden die Zeilen unterschiedlich ineinander geschoben, wenn sie sich treffen.

Zur Abhilfe müssten entweder die Klassen angepasst, oder mit weiteren div gearbeitet werden. Übrigens konnte ich dieses Verhalten auch bei mir nachstellen wenn ich die Bildschirmauflösung unter 1024x768 eingestellt habe.

Gruß Helmut

[4seven]

Hallo Overhead,

wenn garnichts mehr hilft, packst du das "obere" Menü unter Linkes Menü und das Untere in Rechtes Menü (siehe Screen) und nimmst die divs raus. Zeilenumbruch ist dort auch ausgeschaltet, so hast du zumindet pro Reihe soviel Breite zur Verfügung, wie dein Forum in deiner Ansicht breit ist.

http://www.loaditup.de/files/193080.jpg

Würde dann so aussehen:

Code: Alles auswählen

<table width="100%" border="0">
  <tr>
    <td align="left" nowrap="nowrap"><ul style="font-size:0.9em; font-family:Verdana,Arial,sans-serif"> <li class="icon-faq"><a href="{U_FAQ}" title="{L_FAQ_EXPLAIN}">{L_FAQ}</a> | </li>
            <li class="icon-gallery"><a href="{U_GALLERY_MOD}" title="{L_GALLERY_EXPLAIN}">{L_GALLERY}</a> | </li>
            <li class="icon-faq"><a href="{U_RULES}" title="{L_RULES_EXPLAIN}">{L_RULES}</a> | </li>
            <li><img src="/testforum/styles/prosilver/theme/images/icon_filebase.gif" class="imagelink"><a href="{U_FILEBASE}" title="{L_FILEBASE}"accesskey="l">{L_FILEBASE}</a> | </li>
            <li><img src="/testforum/styles/prosilver/theme/images/icon_meetings.gif" class="imagelink"><a href="{U_MEETINGS}" title="{L_MEETINGS}">{L_MEETINGS}</a> | </li></ul></td>
  </tr>
  <tr>
    <td align="right" nowrap="nowrap"><ul style="font-size:0.9em; font-family:Verdana,Arial,sans-serif"> <!-- 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></td>
  </tr>
</table>

lg
4seven

[Helmut]

Hallo Overhead,

so, ich habe jetzt die Lösung, hier ist sie:

overall_header.html

Code: Alles auswählen

[...]
         <!-- 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 -->

              | <a href="{U_SEARCH_SELF}">{L_SEARCH_SELF}</a>
              | <a href="{U_SEARCH_NEW}">{L_SEARCH_NEW}</a>
               <!-- IF U_RESTORE_PERMISSIONS --> |
               <a href="{U_RESTORE_PERMISSIONS}">{L_RESTORE_PERMISSIONS}</a>
               <!-- ENDIF -->
               <!-- IF U_MEETING -->

               | <a href="{U_MEETING}">{MEETING_LINK}</a>
               <!-- ENDIF -->
	</li>
         </ul>	 
         <!-- ENDIF -->
	 
         <ul class="linklist rightside" style="font-size:0.9em; font-family:Verdana,Arial,sans-serif">
	<!-- 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>
	
         <ul class="linklist2 rightside2" style="font-size:0.9em; font-family:Verdana,Arial,sans-serif">
            <li class="icon-faq"><a href="{U_FAQ}" title="{L_FAQ_EXPLAIN}">{L_FAQ}</a> | </li>
            <li class="icon-gallery"><a href="{U_GALLERY_MOD}" title="{L_GALLERY_EXPLAIN}">{L_GALLERY}</a> | </li>
            <li class="icon-faq"><a href="{U_RULES}" title="{L_RULES_EXPLAIN}">{L_RULES}</a> | </li>
            <li><img src="/testforum/styles/prosilver/theme/images/icon_filebase.gif" class="imagelink"><a href="{U_FILEBASE}" title="{L_FILEBASE}"accesskey="l">{L_FILEBASE}</a> | </li>
            <li><img src="/testforum/styles/prosilver/theme/images/icon_meetings.gif" class="imagelink"><a href="{U_MEETINGS}" title="{L_MEETINGS}">{L_MEETINGS}</a> | </li>           
	</ul>
	
[...]

common.css

finde darin

Code: Alles auswählen

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

danach einfügen

Code: Alles auswählen

/* Horizontal lists Mods
----------------------------------------*/

ul.rightside2 {
	float: right;
	width: 100%;
	margin-left: 5px;
	margin-right: -5px;
	text-align: right;
}

ul.linklist2 li {
	display: block;
	list-style-type: none;
	float: right;
	width: auto;
	margin-right: 5px;
	font-size: 1.1em;
	line-height: 2.2em;
}

Damit kommen alle neuen Links von Mods in eine eigene Zeile, es funktioniert bei mir super.

Gruß Helmut

[4seven]

Klasse Lösung

[Overhead]

@ Helmut

Deine Lösung ist megastark - vielen Dank!

@ 4seven

Auch Dir herzlichen Dank für Deinen Ansatz.

cu Overhead