Wilhelm

Pozycjonowanie całkowicie statyczne. Problem z określaniem rozdzielczości i szerokości okna

Polecane posty

Cześć.Mam problem. Robię stronę.Wszystko jest w kontenerze,na tle którego jest obrazek.Na tym obrazku w odpowiednich miejscach są divy(odnośniki). Tylko że te odnośniki musza być w tych samych miejscach niezaleznie od rozdzielczości witryny.

Kod w uproszczeniu wyglada tak:

<div class="container" style="background-image: url(obrazek.jpg)">

  <div id="1">...</div>

     <div id="obrazek"> W środku tego diva jest obraz do którego dopasowuję odnośniki.Ten div jest po to żeby miec pozycje wyjściową do pozycjonowania odnośników</div>

 <div id="2">...</div>

</div>

 

Te trzy divy zajmują 100% szerokości. div="obrazek" w swoich ramach zawsze w ten sam sposób musi mieścić obrazek,żeby odnośniki zawsze leżały tak samo.

Pozycjonuje to dla każdej rozdzielczości ręcznie. I tu jest problem. Robię to tym sposobem:

@media (min-width: 1024px) and (min-height: 768px) {
 .container {width:1024px; height: 768px;}
 .div1   {
     width: 19%;
}
.obrazek   {
    width: 60.5%;
}
.div2    {
    width: 20.5%;
}
}

Problem jest taki,że zapewne okno w którym jest moja strona ma inne wymiary niż rozdzielczość ekranu. I tu się rodzi moje pytanie: w jaki sposób obliczyć jakie wartości powinny być tutaj: @media (min-width: 1024px) and (min-height: 768px)

i tutaj :  .container {width:1024px; height: 768px;}

Oraz przy pomocy czego mógłbym sprawdzać czy działa poprawnie?

Dodam że wszystko póki co robię offline. Za pierwszym razem wszystko ustawiłem wg. narzędzia chrome,jednak jak widac,to nie działa. Wpisywałem różne rozdzielczości w narzędzie dla programistów i pod to ustawiałem wszystko. Jest może jakiś kalkulator rozdzielczości i okna strony? Próbowałem się t

akże posługiwać wtyczką "Resolution test",ale także z marnym rezultatem.

 

 

Dodam tylko że jeśli ustawię np.rozdzielczosć monitora 800x600 i zacznę edytować część która jest dla rozdzielczości 800x600 to nic się nie dzieje.

Udostępnij ten post


Link to postu
Udostępnij na innych stronach

Bądź aktywny! Zaloguj się lub utwórz konto

Tylko zarejestrowani użytkownicy mogą komentować zawartość tej strony


  • Kto przegląda   0 użytkowników

    Brak zalogowanych użytkowników przeglądających tę stronę.