GoldenLine
Zaloguj się
Piotr Skiba

Piotr Skiba Własna działalność
gospodarcza / Web
Developer /
Programista

Temat: Centrowanie strony w poziomie

Witam

Mój problem związany jest z centrowaniem strony, która jest zaprojektowana w oparciu o div. Rozdzielczość ekranu jest 1024x768 a powiedzmy DIV ma szerokość na 1200 w jaki sposób wycentrować w poziomie div-a tak aby była centralnie ustawiona w stosunku do rozdzielczości ( równe odstępy po lewej i prawej stronie na paskach przewijania ). Czy jest taka możliwość i w jaki sposób można było by to wykonać.

Czy można zastosować jakiś jeden główny DIV po którym można środkować stronę ?

Z góry dziękuję za pomoc :)Piotr S. edytował(a) ten post dnia 04.03.09 o godzinie 13:00
Link do wypowiedziLink
Michał Zwoliński

Michał Zwoliński vojo w języku
esperanto to droga
:)

Temat: Centrowanie strony w poziomie

Na elementy blokowe działa margin: 0 auto; oczywiście mówię o pozycjonowaniu w poziomie.

Jeśli chodzi o centrowanie w pionie to jest kilka sposobów.

1. Znając wysokość zawartości Twojej strony, tworzy się diva o wys: height: 50%, pod nim wrzuca się content, któremu dajemy margin-top: -1/2wysokości.

2. Tworzymy jednokomurkową tabelkę na 100% wysokości okna, do komórki wrzucamy kontent i tej całej wielkiej komórce dajemy vertical-align: middle;

3. JavaScript

PS.
Raczej unikaj tworzenia layoutów na bazie tabel.Michał Zwoliński edytował(a) ten post dnia 03.03.09 o godzinie 08:14
Link do wypowiedziLink

konto usunięte

Temat: Centrowanie strony w poziomie

Do centrowania takiego jak chcesz udało mi się wykombinować taki kod:





<!DOCTYPE html>

<style>

html {border:2px solid red;height:100px;position:relative;width:100%;}

body {width:600px; position:absolute;top:0;left:50%; 

    margin-left:-300px;background:yellow; text-align:center;border:1px solid green}

</style>

<div>test</div>


(testowałem tylko w Safari, w IE na 90% to będzie problematyczne).

Ale jest też lepsze rozwiązanie - CSS3 Media Query, które działają w najnowszych wersjach Opery/Safari/Firefox.



@media screen and (max-width:1100px)

{

/* style tylko dla ekranów 1100px i mniejszych */

div {width:1000px}

}
Kornel L. edytował(a) ten post dnia 19.03.09 o godzinie 20:12
Link do wypowiedziLink
Michał Książek

Michał Książek FE-DEV(xhtml/js/jQ)
/ PHP(Symfony, MVC,
Eclipse) / PSD / ...

Temat: Centrowanie strony w poziomie

Na czym polega problem?

Wygląda jakbyś szerokość contentu miał dostosowaną do rozdzielczości 1024. Zatem czy elementu wychodzące poza content to jakieś graficzne rozwiązania ?

Pokaż link etc

Michał Z. dał Ci kupę podpowiedzi.
Link do wypowiedziLink
Piotr B.

Piotr B. Grafik - projektant

Temat: Centrowanie strony w poziomie

Piotrowi chodzi zupełnie o coś innego niż Wy wszyscy tutaj piszecie/odpowiadacie. Chce, aby po odpaleniu diva o szerokości 1200px pod rozdziałką 1024x768 owy div był od razu wyśrodkowany (aby suwak w poziomym scrollu znajdował się na środku i nie trzeba było go ręcznie przesuwać do środka przy każdym odświeżeniu strony).

Piotr, za pomocą css nie zrobisz takiego bajeru.
Link do wypowiedziLink
Michał Książek

Michał Książek FE-DEV(xhtml/js/jQ)
/ PHP(Symfony, MVC,
Eclipse) / PSD / ...

Temat: Centrowanie strony w poziomie

Nie widzę potrzeby stosowania takiego zabiegu.

Nie można wycentrowac contentu, a boki na absolutach sobie rozwalić.
Nie wiem po co Wam ten poziomy scroll???
Link do wypowiedziLink

konto usunięte

Temat: Centrowanie strony w poziomie

Wrzuciłem w innej grupie - wrzucę i tutaj: LayoutGala...
Link do wypowiedziLink
Piotr B.

Piotr B. Grafik - projektant

Temat: Centrowanie strony w poziomie

Michał Książek:
Nie widzę potrzeby stosowania takiego zabiegu.

Nie wiem po co Wam ten poziomy scroll???

Ty nadal nic nie czaisz...
Link do wypowiedziLink

konto usunięte

Temat: Centrowanie strony w poziomie

Piotr B.:
Michał Książek:
Nie widzę potrzeby stosowania takiego zabiegu.

Nie wiem po co Wam ten poziomy scroll???

Ty nadal nic nie czaisz...

A może właśnie czai, tylko też nie do końca :)

Kiedy elementy z position absolute są poza viewportem też spowodują wyświetlenie pasków przewijania, więc to rozwiązanie odpada.

Jeśli boki strony były by tylko grafiką - można je wrzucić jako tło do DIVa i wtedy przy mniejszej rozdzielczości ekranu boki zostaną ładnie przycięte bez wyświetlania pasków przewijania.

Jeśli jednak boki strony nie są grafiką, a treścią - nie ma innego rozwiązania jak JS.
Link do wypowiedziLink
Michał Książek

Michał Książek FE-DEV(xhtml/js/jQ)
/ PHP(Symfony, MVC,
Eclipse) / PSD / ...

Temat: Centrowanie strony w poziomie

Dawid L.:
A może właśnie czai, tylko też nie do końca :)

Jakby nie czaił nie pisałby ;)
Link do wypowiedziLink
« Wróć do tematów
Odpowiedz

Podobne tematy


Następna dyskusja:

banalne centrowanie w poziomie




Wyślij zaproszenie do
Anuluj