CSS - jak wyśrodkować zawartość w oknie? - Grupy dyskusyjne w eGospodarka.pl

eGospodarka.pl › Grupy › pl.comp.www › CSS - jak wyśrodkować zawartość w oknie?

« poprzedni wątek

następny wątek »

Ilość wypowiedzi w tym wątku: 3

1. Data: 2010-09-30 11:39:58
Temat: CSS - jak wyśrodkować zawartość w oknie?
Od: "Marek" <b...@e...com>

Witam,

Nie wiem co robię źle, że zawartość strony WWW nie centruje mi się na
ekranie pod IE8 i FF. Gdzieś kiedyś udało mi się to osiągnąć lecz nie mogę
dojść zastosowanego rozwiązania. Efekt jest taki, że obrazek rysuje się w
lewym górnym rogu przeglądarki. DIV nie ma ani szerokości ani wysokości 100%
pomimo zadeklarowania. Teoretycznie poprawia się sytuacja, gdy zadeklaruję
dla DIV'a position: absolute jedkakże i tak centrowanie w pionie nie
następuje. Poproszę o podpowiedź co przeoczyłem.

Kod mam następujący:

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN"
"http://www.w3.org/TR/html4/strict.dtd">
<html>
<head>
<style type="text/css">
html {
position: relative;
margin: 0px;
padding: 0px;
position: relative;
height: 100%;
width: 100%;
}
body {
position: relative;
margin: 0px;
padding: 0px;
position: relative;
height: 100%;
width: 100%;
}
div {
text-align: center;
vertical-align: middle;
display: table-cell;
height: 100%;
width: 100%;
}
</style>
</head>

<body>
<div><img src="obrazek.jpg" width="800" height="600"></div>
</body>
</html>

[ pokaż wiadomość z nagłówkami ]

do góry
2. Data: 2010-09-30 12:43:50
Temat: Re: CSS - jak wyśrodkować zawartość w oknie?
Od: satellite <p...@g...pl>

On 2010-09-30 13:39, Marek wrote:

> sytuacja, gdy zadeklaruję dla DIV'a position: absolute jedkakże i tak

zobacz tak :

> <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN"
> "http://www.w3.org/TR/html4/strict.dtd">
> <html>
> <head>
> <style type="text/css">
> html {
> }
> body {
> margin: 0px;
> padding: 0px;
> }
> div {

position: absolute;
top: 50%;
left: 50%;
margin-left: -400px;
margin-top: -300px;
width: 800px;
height: 600px;

> }
> </style>
> </head>
>
> <body>
> <div><img src="obrazek.jpg" width="800" height="600"></div>
> </body>
> </html>
>
>

[ pokaż wiadomość z nagłówkami ]

do góry
3. Data: 2010-10-01 10:19:15
Temat: Re: CSS - jak wyśrodkować zawartość w oknie?
Od: "Marek" <b...@e...com>

Dzięki za podpowiedź. Mi chodziło w zasadzie o zastosowanie table-cell.

Zerknij na adres:
http://phrogz.net/css/vertical-align/index.html

Jest tam żółty prostokąt z opisem "<div> using display:table-cell;
vertical-align:middle"
Centruje się pięknie lecz z nieznanych mi powodów nie w przytoczonym przeze
mnie kodzie. Coś musiałem przeoczyć - wydaje mi się, że wszystko wygląda
podobnie.

[ pokaż wiadomość z nagłówkami ]

do góry