VGH: Jak umieścić panele boczne po jednej stronie

Zauważyłam, że osoby, które chcą mieć panele boczne po jednej stronie, to w jednym panelu bocznym wklejają kod tabeli z dwoma kolumnami, a następnie umieszczają tak treść, przez co imituje ona wygląd strony z dwoma panelami po jednej stronie. Cóż, stosując tą metodę, admini nie mogą już wykorzystać domyślnych paneli np. z ankietą, shoutboxem, tematami na forum czy panelem logowania.
Dzięki poradnikowi, pokażę wam, że panele lewe/prawe jednocześnie można umieścić po jednej stronie (patrz obrazek niżej), bez konieczności tworzenia własnych kodów z tabelami, a wystarczy zastosować CSS - dokładniej atrybut float.

Dodam jeszcze, że poradnik mogą stosować wszyscy ci co posiadają strony php-fusion, czy extreme-fusion, a nie wiedzą gdzie dokładnie w plikach PHP wprowadzić zmiany.

Ważne: metodę można zastosować tylko wtedy, gdy znamy szerokość strony i jest ona wyrażona w px, nie %!!!

Poniżej podaję przykładowy kod, dla skórki PrimalBeastsPastels, której szerokość ustaliłam na 900px, panele boczne po 200px i część z newsami na 465 px.

1. Dodaj nowy lub edytuj istniejący panel:
PA -> Zarządzanie stroną -> Zarządzanie panelami

2. W treść panelu wklej jeden z poniższych kodów:

Panele boczne na prawo:
<style type="text/css">
/*-------Jak umieścić panele boczne po jednej stronie-------*/
/*-------Kod przygotowany przez fantagiro | fantidesign.blogspot.com----------------*/

.side-border-left {
float: right;
width:200px;
}

.side-border-right {
width:200px;
}

.main-bg {
width: 465px;
float: left;
}
</style>
Panele boczne na lewo:
<style type="text/css">
/*-------Jak umieścić panele boczne po jednej stronie-------*/
/*-------Kod przygotowany przez fantagiro | fantidesign.blogspot.com----------------*/

.side-border-left {
width:200px;
}

.side-border-right {
width:200px;
float: left;
}

.main-bg {
width: 465px;
float: right;
}
</style> 
2. Zapisz panel i pamiętaj aby go włączyć.

Brak komentarzy:

Prześlij komentarz