Witam szanownych forumowiczów,
Mam stronkę www, ale pojawił się błąd :-(
Pisząc ją pracowałem w roździelcości 1152 x 864
U mnie wygląda ok ale na innych monitorach menu lewe które mam zawarte w css się <ort>rozjerzdza </ort>i przesuwa się pod obrazek zawarty na stronie.
Co należy wpisać do css żeby pozbyć się tego efektu ?
Wróżkami nie jesteśmy. Jakiś kod może albo adres strony?
Jeżeli podajesz wartości absolutne (w pikselach) to nic dziwnego, że się rozjeżdża przy innych rozdzielczościach. Spróbuj podawać wartości np. procentowo.
nie przesadzajmy, procentowe podawanie wszystkich wartości prszy cięciu layoutu opartego o grafikę rastrową może być prawdziwym wyzwaniem - myślę, że w tym kodzie problemem może być mieszanie sposobów zapisu wielkości (margin w ul, ul li)
edit: poza tym, to właśnie podanie wartości w px (i ustawienie stałej szerokości strony) gwarantuje nam nie rozjeżdżanie się strony w różnych rozdzielczościach
No coz chyba nie zrozumieliscie co gosc napisal - jemo to wjezdza pod jakis obrazek. Takie dzialanie jest zawsze wtedy, gdy np menu umiescisz na warstwie ponizej tej, w ktorej masz obrazek. W CSS ustaw wlasciwy z-index i bedzie ok.
Jesli chodzi o menu, jesli w uproszczonej wersji wyobrazimy sobie ze to menu to jakis slupek linkow o szerokosci 220 px (takie cos w jego cssie widzialem) to przy takim ustawieniu nie ma prawa sie rozjezdzac. Niestety kedlaw07 nie zalaczyles kodu strony wiec dalej wrozymy z fusow...
Proponuję zrobić to tak:
<ul style="float: left">
<li><a href="http://www.waldis.ovh.org" onClick="bookmarkit()"alt="Dodaj stronę do Ulubionych">Dodaj do ulubionych</a></li>
<li><a href="linki/linki.html">Przydatne linki</a></li>
<li><a href="humor/humor.html">Humor na stronie</a></li>
<li><a href="galeria/kot.html">Galeria naszego kotka</a></li>
<li><a href="linki/pusta.html">wolny klawisz 1</a></li>
<li><a href="linki/czysta.html">wolny klawisz 2</a></li>
<li><a href="mailto:[email protected]">Napisz do mnie</a></li>
<li><a href="javascript:location.href='mailto:?SUBJECT=' + document.title + '&body=' + escape(location.href)" alt="Powiadom znajomego">Powiadom znajomego</a></li>
</ul>
<div style="float: right">
<!-- obrazek czy coś innego... -->
<img src="galeria/img/kot/kotek.jpg" alt="Nasz ulubiony kotek Mruczek">
</div>
Jeżeli szerokość strony będzie zbyt mała, to obrazek przesunie się pod menu.
Proponuje nie robi tego tak, tylko ustawic wszystko na warstwach ustawionych do lewej. Wtedy nic pod nic nie wjedzie niezaleznie od wielkosci strony. Wrzucilem do dreamewevera wiec wypluje tutaj calosc kodu. Wysokosc i border ustawilem tylko zebys widzial jak to dziala i wyglada:
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.1//EN" "http://www.w3.org/TR/xhtml11/DTD/xhtml11.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-2" />
<title>Untitled Document</title>
</head>
<body>
<div style="position: relative; float: left; width: 220px; height: 200px; border: 1px solid #aaa;">
tutaj wstaw swoje menu</div>
<div style="position: relative; float: left; margin-left: 250px; width: auto; right: 0px; height: 200px; border: 1px solid #aaa;">
tutaj wstaw tresc strony</div>
</body>
</html>