Pozdrav,
može li mi neko pomoći oko ovoga: na ovoj stranici pozadina od izbornika se zezne kada se koristi zoom (skupa sa slikama) u operi ili firefoxu (ili kada se refresha dok je veličina browsera premala za prikaz cijele stranice pa se skrola udesno, kao na screenshotu).
http://img828.imageshack.us/img828/104/calidobug.png
htio bih, naravno, da ostane kao na gornjoj slici, bez obzira na zoom i veličinu prozora.
Ako hoćeš da iskreno razgovaramo, onda zato što si zakomplicirao kod do übera.
Ako hoćeš na brzinu riješiti problem, makni width sa width_majstor i trebalo bi sjesti na svoje.
Ovo:
[HTML]
<div class="a_header"><a class="menu" href="onama.html">o nama</a></div>
<div class="a_header_selected"><a class="menu" href="index.html">home</a></div>
</div>
<div class="frames"></div>
<div class="content">
<div class="content_padding_p"></div>
<h1>Home</h1>
<p>Grupa CALIDO se nakon vrlo uspješnog albuma prvijenca predstavlja novim singlom, pjesmom "ZOVEM TE". U svom jedinstvenom akustičnom stilu,
grupa CALIDO donosi pjesmu poletnog ritma i zaraznog refrena.
</p>
<p>Uz pokretnu i svježu glazbenu pratnju, te retrospektivan lirski tekst, pjesma "ZOVEM TE" svojom iskrenošću osvaja na prvo slušanje.
</p>
Za grupu ova pjesma predstavlja novu stepenicu te jasan glazbeni napredak.
<p>
<object width="450" height="362"><param name="movie" value="http://www.youtube.com/v/ifmpeVOjPbo?fs=1&hl=en_US"></param><param name="allowFullScreen" value="true"></param><param name="allowscriptaccess" value="always"></param><embed src="http://www.youtube.com/v/ifmpeVOjPbo?fs=1&hl=en_US" type="application/x-shockwave-flash" allowscriptaccess="always" allowfullscreen="true" width="450" height="362"></embed></object>
</p>
<p>Posjetite nas na:</p>
<ul>
<li><a href="http://www.myspace.com/calidomusic">Myspace stranicama</a> ili</li>
<li><a href="http://www.facebook.com/pages/Calido/25196182785">Facebooku</a></li>
</ul>
<div class="content_padding"></div>
</div>
</div>
<div class="footer_author">
Web design by Jerko Steiner
</div>
si mogao zamijeniti ovim:
[HTML]
Grupa CALIDO se nakon vrlo uspješnog albuma prvijenca predstavlja novim singlom, pjesmom "ZOVEM TE". U svom jedinstvenom akustičnom stilu, grupa CALIDO donosi pjesmu poletnog ritma i zaraznog refrena.
Uz pokretnu i svježu glazbenu pratnju, te retrospektivan lirski tekst, pjesma "ZOVEM TE" svojom iskrenošću osvaja na prvo slušanje.
Za grupu ova pjesma predstavlja novu stepenicu te jasan glazbeni napredak.
Posjetite nas na:
Evo ti napravi svoj css i pokaži ga, a ako negdje baš zapneš postaj ovdje pa ćemo riješiti zajedno.
Druga stvar imaš previše malih fragmenata slika koje postavljaš kao background, a možeš ih postaviti kao jednu preko cijele stranice, nema razloga da imaš npr. fcvijwetgornji.png, cvijet donji.png gitara.png itd. Složi to u jednu sliku, transparent i postavi to kao background od .body elementa.
“Preskupo” ti je nabacivati se s toliko elemenata po stranici, a ne potrebno.
Sad da odmah uskočim u riječ onima koji će me napasti, naravno da za ovako malo stranicu to što sam napisao i nije važno, ali upravo ovako male stranice su najnolji početak za stvaranje kvalitetnih navika semantički ispravnog kodiranja, a ne da se nabacuje elementima.
Inače dizajn ti je super.
Hvala na konstruktivnim kritikama. Stvaro sam ga malo pretjerao s divovima…
Dosta sam pojednostavio kod, koristeći smjernice gore, ali čini mi se da se opet ista stvar događa kad se širina browsera smanji:
http://www.inet.hr/~ssteiner/index_proba.html
unutar bodyja je sljedeće:
[HTML]
<div class="content">
<h1>Home</h1>
<p>Grupa CALIDO se nakon vrlo uspješnog albuma prvijenca predstavlja novim singlom, pjesmom "ZOVEM TE". U svom jedinstvenom akustičnom stilu,
grupa CALIDO donosi pjesmu poletnog ritma i zaraznog refrena.
</p>
<p>Uz pokretnu i svježu glazbenu pratnju, te retrospektivan lirski tekst, pjesma "ZOVEM TE" svojom iskrenošću osvaja na prvo slušanje.
</p>
Za grupu ova pjesma predstavlja novu stepenicu te jasan glazbeni napredak.
<p>
<object width="450" height="362"><param name="movie" value="http://www.youtube.com/v/ifmpeVOjPbo?fs=1&hl=en_US"></param><param name="allowFullScreen" value="true"></param><param name="allowscriptaccess" value="always"></param><embed src="http://www.youtube.com/v/ifmpeVOjPbo?fs=1&hl=en_US" type="application/x-shockwave-flash" allowscriptaccess="always" allowfullscreen="true" width="450" height="362"></embed></object>
</p>
<p>Posjetite nas na:</p>
<ul>
<li><a href="http://www.myspace.com/calidomusic">Myspace stranicama</a> ili</li>
<li><a href="http://www.facebook.com/pages/Calido/25196182785">Facebooku</a></li>
</ul>
</div>
<div class="footer_author">
Web design by Jerko Steiner
</div>[/HTML]
dio css vezan za gornji html:
/*** MENI ***/
ul.nav {
background-image:url(../images/top.png);
background-repeat: repeat-x;
height: 99px;
width: auto;
}
li.nav_li {
list-style-type: none;
padding-left: 16px;
padding-right: 16px;
float: right;
padding-top: 50px;
font-size: 1.1em;
z-order: 100;
}
/*** POZADINA ***/
div.content {
background-image: url(../images/body_back.png);
background-repeat: no-repeat;
background-position: left top;
margin-top: -50px;
width: 430px;
margin-left: auto ;
margin-right: auto ;
padding-left: 510px;
padding-bottom:212px;
padding-top: 108px;
}
uspio sam riješiti ovaj problem dodavanjem min-widtha.
Moraš si odrediti širinu “kontejnera” u kojem želiš raditi, znači obmotati cijeli layout u jedan glavni element koji će služiti kao kontejner gdje ćeš sve trpati. Probaj staviti u css pravilo npr.
#wrapper {
width: 960px; /* širina omotača u kojem će biti smješten sav sadržaj */
margin: 0 auto; /* ovo je za centriranje stranice u browserima */
}
nakon cijeli sadržaj ubaci u taj element:
[HTML]
<div class="content">
<h1>Home</h1>
<p>Grupa CALIDO se nakon vrlo uspješnog albuma prvijenca predstavlja novim singlom, pjesmom "ZOVEM TE". U svom jedinstvenom akustičnom stilu,
grupa CALIDO donosi pjesmu poletnog ritma i zaraznog refrena.
</p>
<p>Uz pokretnu i svježu glazbenu pratnju, te retrospektivan lirski tekst, pjesma "ZOVEM TE" svojom iskrenošću osvaja na prvo slušanje.
</p>
<p>Za grupu ova pjesma predstavlja novu stepenicu te jasan glazbeni napredak.</p>
<p>
<object width="450" height="362"><param name="movie" value="http://www.youtube.com/v/ifmpeVOjPbo?fs=1&hl=en_US"></param><param name="allowFullScreen" value="true"></param><param name="allowscriptaccess" value="always"></param><embed src="http://www.youtube.com/v/ifmpeVOjPbo?fs=1&hl=en_US" type="application/x-shockwave-flash" allowscriptaccess="always" allowfullscreen="true" width="450" height="362"></embed></object>
</p>
<p>Posjetite nas na:</p>
<ul>
<li><a href="http://www.myspace.com/calidomusic">Myspace stranicama</a> ili</li>
<li><a href="http://www.facebook.com/pages/Calido/25196182785">Facebooku</a></li>
</ul>
</div>
<div class="footer_author">
Web design by Jerko Steiner
</div>
</div>
[/HTML]
I vidjet ćeš što će se dogoditi, naravno širinu tog omotača možeš odrediti koliku god ti želiš, ali nekako se ustalilo 960px zbog grid design patterna u dizajnu općenito koji nije prisutan samo na web-u.
Naravno ovakav pristup ima za potrebu da neke lemente i malo drugačije izrežeš u alatu koji koristiš za dizajn stranica.
Najbolje ti je da porbaš to uraditi i onda probaj sužavati i širiti browser da vidiš kako će reagirati. Ukoliko ima nejasnoća javi se.
Pozdrav