Re: Dostosowanie szablonu pod 1024x768 lub dowolnej - Grupy dyskusyjne w eGospodarka.pl

eGospodarka.pl › Grupy › pl.comp.www › Dostosowanie szablonu pod 1024x768 lub dowolnej › Re: Dostosowanie szablonu pod 1024x768 lub dowolnej

Path: news-archive.icm.edu.pl!news.rmf.pl!agh.edu.pl!news.agh.edu.pl!news.onet.pl!new
s.nask.pl!news.nask.org.pl!news.unit0.net!feeder.news-service.com!feeder.news-s
ervice.com!postnews.google.com!f6g2000yqa.googlegroups.com!not-for-mail
From: WebCM <w...@g...com>
Newsgroups: pl.comp.www
Subject: Re: Dostosowanie szablonu pod 1024x768 lub dowolnej
Date: Thu, 12 Aug 2010 15:11:16 -0700 (PDT)
Organization: http://groups.google.com
Lines: 92
Message-ID: <b...@f...googlegroups.com>
References: <9...@h...googlegroups.com>
<i40pgh$4o1$1@inews.gazeta.pl>
NNTP-Posting-Host: 83.1.217.52
Mime-Version: 1.0
Content-Type: text/plain; charset=ISO-8859-2
Content-Transfer-Encoding: quoted-printable
X-Trace: posting.google.com 1281651077 31312 127.0.0.1 (12 Aug 2010 22:11:17 GMT)
X-Complaints-To: g...@g...com
NNTP-Posting-Date: Thu, 12 Aug 2010 22:11:17 +0000 (UTC)
Complaints-To: g...@g...com
Injection-Info: f6g2000yqa.googlegroups.com; posting-host=83.1.217.52;
posting-account=KmuZcQoAAACFwi1E7xIpy-n6K4ZXwoJm
User-Agent: G2/1.0
X-HTTP-UserAgent: Mozilla/5.0 (Windows; U; Windows NT 5.1; pl; rv:1.9.2.6)
Gecko/20100625 Firefox/3.6.6 (.NET CLR 3.5.30729),gzip(gfe)
Xref: news-archive.icm.edu.pl pl.comp.www:396447
[ ukryj nagłówki ]
> Dodatkową wadą takiego rozwiązania jest to, że przy większej szerokości
> strony masz dłuższe wiersze, żeby więc łatwiej się czytało powinieneś
> zwiększyć font-size i interlinię, a tego w CSS nie zrobisz. Więc lepiej
> odpuść sobie layout na %.

Z jednej strony tak, a z drugiej: w ciągu roku udział 1024x768 spadł
do ~25%. Może utrzymać się długo ze względu na wzrost ilości
netbooków, laptopów i innych urządzeń przenośnych. Jednak użytkowników
większych rozdzielczości jest więcej, dlatego chciałbym ułatwić im
życie - dostosować layout głównie dla nich.

Inną opcją jest stworzenie 2 wersji o stałej szerokości - jednej dla
1024x768, a drugiej dla wyższych (wtedy można newsy wyświetlać np. w 2
łamach). Pojawi się kolejny problem - drugą wersję dla jakiej
rozdzielczości? ;)

Naprawdę zagubiłem się :/

Pobawiłem się w CSS. Nie ma problemu z zastosowaniem One True Layout,
ale edycja takiego układu dla mniej cierpliwego webmastera może być
koszmarem. Robi się to tak:

<body>
<div id="top"></div>
<div id="pasekMenu"></div>
<div id="kontenerNaSmieci">
<div id="srodkowyPanel"></div>
<div id="lewyPanel"></div>
<div id="prawyPanel"></div>
</div>
<div id="stopka"></div>
</body>

#srodkowyPanel {
float: left;
width: 100%; /* nie wiem, ile % szerokości zajmie panel przy danej
szerokości !! */
}

#lewyPanel {
float: left;
margin-left: -100%; /* chyba to ma związek z ustawieniem 100% dla
środkowego */
position: relative;
right: 240px; /* chyba to samo to left: -240px, uwzględniamy
margines 10px */
width: 230px;
}

#prawyPanel {
float: left; /* ostatecznie można ustawić right */
margin-right: -240px;
width: 230px;
position: relative;
}

#kontenerNaSmieci {
min-width: 400px; /* minimalna szerokość środka */
padding-left: 240px;
padding-right: 230px;
position: relative;
}

Coś może pomotałem, ale efekt powinien wyjść. Czy da się wyrzucić
nadmiarowy element #kontenerNaSmieci? Jeżeli wrzuciłbym jego CSS-y do
znacznika <body>, wtedy marginesy wpłyną na nagłówek, pasek menu i
stopkę.

Pewnie istnieją lepsze sposoby na uzyskanie efektu (3 kolumny, boczne
o stałej szerokości, środkowa o zmiennej). Najlepiej, by środkowa
kolumna pojawiła się w kodzie jako pierwsza, a potem boczne -
rozwiązanie ma swoje zalety.

Na koniec wrócę do pytania o sens tworzenia szablonu, w którym boczne
panele są stałe, zaś środkowy dostosowuje się do szerokości okna
przeglądarki. Taki układ ma wady i zalety:

+ dostosuje się do szerokości = ładniejszy wygląd
+ nie trzeba tworzyć oddzielnych wersji
+ można ustawić max i min
- trochę nadmiarowego kodu HTML i CSS
- wymaga dużo obliczeń, modyfikacja jest trudna
- zawartość/tekst może stać się zbyt długi