PDA

Zobacz pełną wersję : Problem z rozdzielczością


kris.sycewo
13-02-2012, 12:27
Siema. Mam mały problem z rozdzielczością strony a dokładniej nie mogę ustalić jednej wielkości strony. na laptopach strona wygląda idealnie, po ok. 4cm marginesy po prawej i lewej stronie a na 99% stacjonarnych wygląda tragicznie. wszystko jest wielkie tak że strona nie mieści się na monitorze i trzeba ją przesuwać

strona to: http://www.spotrowemakolno.ugu.pl/

początek index.php:

</head>
<jdoc:include type="head" style="xhtml" />
<body onLoad="initcolla()">
<div class="top_bg">
</div>
<div class="site">
<div class="back_stripe_left">
</div>
<div class="inner_site">

a css:

@charset "utf-8";
/* CSS Document */


body {
background-image: url(../images/tlo.jpg);
background-position: center top;
margin: 0 0 0 -20px;
min-width: 960px;


}


.top_bg {
height: 241px;
width: auto;
min-width: 80%;
margin: 0 0 0 0;
background-image: url(../images/tlo.jpg);
background-position: top;
background-repeat: repeat-x;
}


.site {
height: auto;
width: 960px;
margin-top: -241px;
margin-left: auto;
margin-right: auto;

co musze dodać żeby na każdym monitorze nie zależnie od rozdzielczości wyglądało tak samo?
nikszal
13-02-2012, 14:13
wszystko jest wielkie tak że strona nie mieści się na monitorze i trzeba ją przesuwać
Nic w tym dziwnego. Masz groch z kapustą w css. Szerokość arkusza strony i szerokość headera są większe od minimalnej szerokości określonej w body i dlatego szablon rozjeżdża się na boki.

Przy szerokości 1000px w rozdzielczości poziomej monitora 1024px na dole przeglądarki już pojawi się pasek przewijania, więc pamiętaj o użytkownikach pracujących w niższych rozdzielczościach lub formatuj szerokości w innych jednostkach niż piksele.
Zaprzyjaźnij się z Firebugiem.


body {
background-image: url(../images/tlo.jpg);
background-position: center top;
margin: 0 0 0 -20px;
min-width: 960px;

.inner_site {
background-color: #1B1B1B;
float: left;
height: auto;
width: 800px;
}

.header {
...
width: 1037px;
}

.shadow_right_header {
...
width: 100px;
}

.content_site {
...
width: 1000px;
}
kris.sycewo
13-02-2012, 14:42
body {
background-image: url(../images/tlo.jpg);
background-position: center top;
margin: 0 0 0 -20px;
min-width: 960px;

.inner_site {
background-color: #1B1B1B;
float: left;
height: auto;
width: 800px;
}

.header {
...
width: 1037px;
}

.shadow_right_header {
...
width: 100px;
}

.content_site {
...
width: 1000px;
}
[/QUOTE]

niestety poprawienie owych parametrów nic nie zmieniło, a z przyczyn oczywistych dla większości internautów używam chroma i wbudowanego w nim Developera Tools także nie zamierzam zaprzyjaźniać się mozillą
nikszal
13-02-2012, 14:51
niestety poprawienie owych parametrów nic nie zmieniło
Nie będę wyprowadzać Ciebie z błędu, skoro twierdzisz, że wszystko poprawiłeś, choć zmian nie widać.

Pozdrawiam
kris.sycewo
13-02-2012, 14:55
poprawiłem to co mogłem bo header nie może zostać zmieniony
nikszal
13-02-2012, 15:00
To się zastanów jak się pozbyć dolnego paska przewijania w rozdzielczości monitora 1024px przy headerze szerokim na 1037px.
Ja nie widzę takiej możliwości bez przemodelowania css.
kris.sycewo
14-02-2012, 09:20
na moje skromne oko nie chodzi o pozycje header, bo jakbyś nie zauważył ma ona taki sam rozmiar jak to jaśniejsze tło pod całą stroną

---------- Post dodany 14-02-2012 o 09:20 ---------- Poprzedni post był 13-02-2012 o 16:29 ----------

poprawiłem to i wydaje mi sie że teraz powinno być dobrze, może ktoś spojrzeć jeszcze raz na tą stronę i ocenić rozmiary