Darstellungsproblem mit Sidebar und Forum

[darot]

Hallo Leute.

Ich habe in meinem Forum auf der linken Seite eine Sidebar eingebaut und der Forenstyle ist auf Prosilver aufgebaut. Nun habe ich festgestellt, dass es bei kleineren Bildschirmen zu Darstellungsproblemen gibt. Geht man mit einem kleineren Bildschirm ins Forum, verschwindet die Sidebar nach unten. Dann ist oben das Forim und ganz unten wird dann die Sidebar angezeigt.

Ich habe versucht die Sidebar zu fixieren, was aber auch zu Problemen führt. Die Sidebar bleibt an ihrem Ort wie sie sollte, aber das Forum verschwindet dann unter der Sidebar. Nun müsste ich irgendwie die Linke Seite vom Forum fixieren können. So das, dass ganze Forum schmaler wird. Im Portal ist es ja auch möglich, auf der linken und rechten Seite eine Sidebar zu haben und bei kleineren Bildschirmen wird dann einfach der Mittlere Bereich schmaler.

Kann mir jemand behilflich sein und mir sagen, was ich wo ändern müsste?

Gruss, Darot

[Metzle]

Hallo,

schau dir mal dieses Snippet an: Navigationsbox an der Seite Eventuell hilft dir das weiter.

[darot]

Hallo

Danke dir. Hat mir aber nichts geholfen, da meine Sidebar anders eingebaut ist. Die Besteht aus einer sidebar.html und sidebar.css

[Crizzo]

Hi,

kannst du dein Forum verlinken, damit wir uns dein Problem mal anschauen können?

Grüße

[darot]

Hallo

Hier der Link http://hundiforum.ch/forum/index.php?si ... 2ba6ddd38a
Wenn man eingeloggt ist, erscheinen noch einige zusätzliche Links in der Sidebar. Ausserdem zeigt es dann auch die User die im Chat sind an. Wenn man eingeloggt ist, rutscht die Sidebar noch viel früher nach unten.

Gruss, Darot

[Crizzo]

Gut, dass ist ganz normales Verhalten. Die beiden "Board" und "Sidebar" floaten nebeneinander her, sobald die Sidebar kein Platz hat, ruscht sie nach unten wo sie Platz hat.

Ein mögliche Lösung:
<div class="page-sidebar"> packst du inkl. Inhalt im Quelltext über die <div id="page-body">. Danach:
SUCHE:

Code: Alles auswählen

.page-sidebar {
    float: left;
    margin-top: 4px;
    min-width: 15%;
}

ERSETZE MIT:

Code: Alles auswählen

.page-sidebar {
    float: left;
    margin-top: 4px;
    width: 160px;
}

SUCHE:

Code: Alles auswählen

#page-body {
    clear: both;
    float: right;
    margin: 4px 0;
    width: 80%;
}

ERSETZE MIT:

Code: Alles auswählen

#page-body {
   /* clear: both; bin ich mir nicht sicher, ob das stört, mal probieren */
    margin: 4px 0 4px 170px;
}

Danach ist quasi der Foren-Bereich flexibel und wird breiter und schmaler, je nachdem wie breit das Browserfenster ist und die Sidebar ist immer 160px breit, an der linken Seite und rutscht nicht nach unten.

Grüße

[darot]

Hallo

Ich habe hier die overall_footer https://www.phpbb.de/support/pastebin.p ... iew&s=1039 in der die Sidebar includiert ist.
Was genau muss ich hier ändern?

Gruss, Darot

[Crizzo]

Hi,

du nimmst jetzt diesen Abschnitt:

Code: Alles auswählen

<!-- INCLUDE sidebar.html -->

und löscht ihn aus der overall_footer.html.

Jetzt öffnest du die overall_header.html
SUCHE:

Code: Alles auswählen

<div id="page-body">

ERSETZE MIT:

Code: Alles auswählen

<!-- INCLUDE sidebar.html -->
<div id="page-body">

Und dann machst du die hier genannten Änderungen in deinen CSS-Dateien: viewtopic.php?f=89&t=222448&p=1269834#p1269822

[darot]

Nun zeigt es mir die Sidebar oberhalb vom Forum an und braucht dort die ganze Bildschirmbreite.

Bei mir sieht der Abschnitt in der overall_hedaer, der geändert werden muss, so aus:

Code: Alles auswählen

	<a name="start_here"></a>
	<!-- IF SCRIPT_NAME == "portal" --><div id="page-body-portal"> <!-- ELSE --><div id="page-body"><!-- ENDIF -->
		<!-- IF S_BOARD_DISABLED and S_USER_LOGGED_IN and (U_MCP or U_ACP) -->

Wie muss ich da nun die Änderungen vornehmen?

[Crizzo]

So:

Code: Alles auswählen

       <a name="start_here"></a>    
<!-- INCLUDE sidebar.html -->
       <!-- IF SCRIPT_NAME == "portal" --><div id="page-body-portal"> <!-- ELSE --><div id="page-body"><!-- ENDIF -->
          <!-- IF S_BOARD_DISABLED and S_USER_LOGGED_IN and (U_MCP or U_ACP) -->

oder so, falls die Sidebar beim Portal nicht erscheinen soll:

Code: Alles auswählen

       <a name="start_here"></a>    

       <!-- IF SCRIPT_NAME == "portal" --><div id="page-body-portal"> <!-- ELSE --><!-- INCLUDE sidebar.html --><div id="page-body"><!-- ENDIF -->
          <!-- IF S_BOARD_DISABLED and S_USER_LOGGED_IN and (U_MCP or U_ACP) -->

Und die ist deshalb oberhalb und über die volle Breite, weil du wohl die Änderung in der CSS-Datei noch nicht umgesetzt hast.