Forum » Izdelava spletišč » CSS različne ločljivosti
CSS različne ločljivosti
Wolfman ::
Pozdravljeni. Narredil sem eno stran, (html+css) in jo naštimal da mi dela po večini normalno v vseh browserjih. Druga stvar je ko je drugačna ločljivost zaslona, saj mi sidebar dvigne proti vrhu in razmak se poveča. (Vse ostalo dela normalno, razen 3 sidebari se dvignejo in prekrijejo header) Zanima me kako bi nastavil da bi delovalo na vseh ločljivostih. Sem poskušal določiti pozicijo na strani s % ampak ni dobro.
Nekatere stvari mogoče niso ravno najbolje nastavljene, ker preizkušam kodo, in gotovo tudi ni urejena, vendar je to moj prvi resni projekt.
Tukaj še html.
Tisto vmes contenta je fill namesto lorem ipsum...
Hvala že vnaprej
body,html { height: 100%; } body { margin:0; padding:0; background: #00588d; color: white; } body:nth-of-type(1) .navigacija { padding:1%; } a:link, a:visited, a:active { text-decoration: none; color: white; } img { border: 0px; } a:hover { text-decoration: underline; color: white; } #wrapper { height:80%; min-height: 100%; position:static; margin-left: auto; margin-right: auto; width:1000px; } #top { background: #04609a; width: 100%; height:30px; float: top; } body:nth-of-type(1)#search { top:19px; } #search { background-image: url(images/search.gif); background-repeat: no-repeat; background-position: top; height:35px; width:182px; position:absolute; top:15px; left: 70%; } #iskanje { background: white; height:20px; width:150px; position:absolute; top:7px; left: 9%; color: #04609a; font: italic; } #header { background: url("images/header2.gif") center repeat-x; position: absolute; top: 3%; left:0%; height:200px; width: 100%; } #nav { position: absolute; left: 0%; top: 32%; width: 100%; height: 0px; border-top: 1px #1fb2ff solid; } .navigacija { font-weight: bold; font-family: verdana; text-align: center; font-size: 18px; position: relative; top:-10%; } #leva { background: url(images/leva.gif) bottom no-repeat; width: 51px; height: 50px; position:absolute; top:735%; left: 0%; border-bottom: 1px #0093e0 solid; } #sredina { background: url(images/sredina.gif) bottom repeat-x; width: 95%; height: 50px; position:absolute; top:735%; left: 3%; border-bottom: 1px #0093e0 solid; } #desna { background: url(images/desna.gif) bottom no-repeat; width: 51px; height: 50px; position:absolute; top:735%; left: 95.5%; border-bottom: 1px #0093e0 solid; } a.navigacija:hover { color: red; text-decoration:none; background-color: #035d8d; } #reklame { position: absolute; border: #0093e0 solid; top: 45%; left: 15%; width: 700px; height: 100px; background: white; color: navy; margin:auto; margin-bottom: 2%; } #content { position:relative; width: 60%; margin: 10px; padding: 15px; left: 5%; background: #014977; max-height: 5000px; min-height:500px; top: 67%; border: #0093e0 double 2px; } body:nth-of-type(1) #right1 { top:-190%; } #right1 { position: relative; top:-242%; float: right; width: 20%; margin-right: 5%; background: #014977; min-height: 500px; border: #0093e0 solid 2px; margin-bottom: 2%; margin-top: 2%; padding: 0.6%; } body:nth-of-type(1) #right2 { top: -103%; } #right2 { position: relative; top:-145%; left: 26.5%; float: right; width: 20%; margin-right: 5%; background: #014977; min-height: 400px; border: #0093e0 solid 2px; padding: 0.6%; } body:nth-of-type(1) #right3 { top: -34%; left:52.9%; } #right3 { position: relative; top:-68%; left: 53%; float: right; width: 20%; margin-right: 5%; background: #014977; min-height: 500px; border: #0093e0 solid 2px; padding: 0.6%; } #footer { position: relative; bottom:0px; width:100%; background: url(images/footer.gif); height: 50px; clear:both; line-height: 50px; text-align: center; border-top:1px #0093e0 solid; } a.copy { font-style: italic; }
Nekatere stvari mogoče niso ravno najbolje nastavljene, ker preizkušam kodo, in gotovo tudi ni urejena, vendar je to moj prvi resni projekt.
Tukaj še html.
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> <html> <head> <meta http-equiv="Content-Type" content="text/html;charset=windows-1250" /> <title>Prva stran</title> <link href="new.css" rel="stylesheet" type="text/css" /> <link href="images/favico.ico" rel="shortcut icon" /> <!--[if IE]> <link href="ie.css" rel="stylesheet" type="text/css" /> <![endif]--> </head> <body> <div id="wrapper"><div id="top"></div> <div id="header"><div id="logo" style="position: absolute; border: #0093e0 solid; top: 13%; left: 2%; width: 650px; height: 120px; background: white; color: navy;"><h1>LOGOTIP</h1></div> </div> <div id="search"> <div id="iskanje" <form> Iskanje... </form></div></div> <div id="nav"> <div id="leva"></div><div id="sredina"><h2 class="navigacija"> <a class="navigacija" href="index2.html">Domov</a> <a class="navigacija" href="omeni.html">O Meni</a> <a class="navigacija" href="tutorials.html">Vodiči</a> <a class="navigacija" href="wiki">Wiki</a> <a class="navigacija" href="forum">Forum</a> <a class="navigacija" href="chat">Klepet</a> <a class="navigacija" href="kontakt.html">Kontakt</a> </h2></div><div id="desna"></div></div> <div id="reklame"></div> <div id="content"><h2>BLA BLA BLA</h2><p />Kinou wa call sign, Zenbu, keitai de Kinou wa call sign, Zenbu, keitai de Norenai fuzz guitar Hen na kouen de Muchuu de motor bike, Kaze wo oikoshite Mikazuki wa hisuterii, Boku no ue de Chikyuu wa goorurain, Inu mo raion mo Kasei ni moving on. Nanka mendou de Yellow moon. I ma mo, mittsu, Kazoete, me wo akete Shadow moon Mada yume wo miteru Me wo mite, me wo mite, Se wo mukeainagara Me wo mite, tell me yes or no? Everyday everynight Omoi tsuku kotoba d e Kimi e no omoi wo ima sugu tsutaetai Everyday everynight Arifureta aizu de Chirakatta m ama no kimochi wo tsutaetai Kibun wa kaisei, kondo, issho ni Karada wo dakishimete, kin no kyoukai de Yellow moon Kaketa yozora dewa tsuki wa kyou mo Shizuka na kao de hikaru no sa Me wo mite, me wo mite, Se wo mukeainagara Me wo mite, tell me yes or no? Everyday everynight Omoi tsuku kotoba de Everyday everynight Kimi e no omoi wo tsutaeyou Everyda y Yellow moon. Ima mo, mittsu, Kazoete, me wo akete Shadow moon Mada yume wo miteru Me wo mite, me wo mite, Se wo muke ai nagara Me wo mite, itsu aeru? Everyday everynight Omoi tsu ku kotoba de Kimi e no omoi wo ima sugu tsutaetai Everyday everynight Arifureta aizu de Chira katta mama no kimochi wo, ima sugu Mahou no koodochenji, Nemure nai machi Higawari na jazz gui tar Sotto mainaa deKinou wa call sign, Zenbu, keitai de Norenai fuzz guitar Hen na kouen de Mu chuu de motor bike, Kaze wo oikoshite Mikazuki wa hisuterii, Boku no ue de Chikyuu wa goorurai <hr /><p> , <h1>Inu mo raion</h1> mo Kasei ni moving on. Nanka mendou de Yellow moon. Ima mo, mittsu, Kazoete, me wo akete Shadow moon Mada yume wo miteru Me wo mite, me wo mite, Se wo mukeainagara Me wo mit , tell me yes or no? Everyday everynight Omoi tsuku kotoba de Kimi e no omoi wo ima sugu tsut Everyday everynight Arifureta aizu de Chirakatta mama no kimochi wo tsutaetai Kibun wa kaise i, kondo, issho ni Karada wo dakishimete, kin no kyoukai de Yellow moon Kaketa yozora dewa t suki wa kyou mo Shizuka na kao de hikaru no sa Me wo mite, me wo mite, Se wo mukeainagara Me wo mite, tell me yes or no? Everyday everynight Omoi tsuku kotoba de Everyday everynight Kimi e no omoi wo tsutaeyou Everyday Yellow moon. Ima mo, mittsu, Kazoete, me wo akete Shadow moon Mada yume wo miteru Me wo mite, me wo mite, Se wo muke ai nagara Me wo mite, itsu aeru? Everyday everynight Omoi tsuku kotoba de Kimi e no omoi wo ima sugu tsutaetai Everyday everynight Arifureta aizu de Chirakatta mama no kimochi wo, ima sugu Mahou no koodochenji, Nemure nai machi Higawari na jazz guitar Sotto mainaa deKinou wa call sign, Zenbu, keitai de Norenai fuzz guitar Hen na kouen de Muchuu de motor bike, Kaze wo oikoshite Mikazuki wa hisuterii, Boku no ue de Chikyuu wa goorurain, Inu mo raion mo Kasei ni moving on. Nanka mendou de Yellow moon. Ima mo, mittsu, Kazoete, me wo akete Shadow moon Mada yume wo miteru Me wo mite, me wo mite, Se wo mukeainagara Me wo mite, tell me yes or no? Everyday everynight Omoi tsuku kotoba de Kimi e no omoi wo ima sugu tsutaetai Everyday everynight Arifureta aizu de Chirakatta mama no kimochi wo tsutaetai Kibun wa kaisei, kondo, issho ni Karada wo dakishimete, kin no kyoukai de Yellow moon Kaketa yozora dewa tsuki wa kyou mo Shizuka na kao de hikaru no sa Me wo mite, me wo mite, Se wo mukeainagara Me wo mite, tell me yes or no? Everyday everynight Omoi tsuku kotoba de Everyday everynight Kimi e no omoi wo tsutaeyou Everyday Yellow moon. Ima mo, mittsu, Kazoete, me wo akete Shadow moon Mada yume wo miteru Me wo mite, me wo mite, Se wo muke ai nagara Me wo mite, itsu aeru? Everyday everynight Omoi tsuku kotoba de Kimi e no omoi wo ima sugu tsutaetai Everyday everynight Arifureta aizu de Chirakatta mama no kimochi wo, ima sugu Mahou no koodochenji, Nemure nai machi Higawari na jazz guitar Sotto mainaa de Norenai fuzz guitar Hen na kouen de Muchuu de motor bike, Kaze wo oikoshite Mikazuki wa hisuterii, Boku no ue de Chikyuu wa goorurain, Inu mo raion mo Kasei ni moving on. Nanka mendou de <hr /> Yellow moon. Ima mo, mittsu, Kazoete, me wo akete Shadow moon Mada yume wo miteru Me wo mite, me wo mite, Se wo mukeainagara Me wo mite, tell me yes or no? Everyday everynight Omoi tsuku kotoba de Kimi e no omoi wo ima sugu tsutaetai Everyday everynight Arifureta aizu de Chirakatta mama no kimochi wo tsutaetai Kibun wa kaisei, kondo, issho ni Karada wo dakishimete, kin no kyoukai de Yellow moon Kaketa yozora dewa tsuki wa kyou mo Shizuka na kao de hikaru no sa Me wo mite, me wo mite, Se wo mukeainagara Me wo mite, tell me yes or no? Everyday everynight Omoi tsuku kotoba de Everyday everynight Kimi e no omoi wo tsutaeyou Everyday Yellow moon. Ima mo, mittsu, Kazoete, me wo akete Shadow moon Mada yume wo miteru Me wo mite, me wo mite, Se wo muke ai nagara Me wo mite, itsu aeru? Everyday everynight Omoi tsuku kotoba de Kimi e no omoi wo ima sugu tsutaetai Everyday everynight Arifureta aizu de Chirakatta mama no kimochi wo, ima sugu Mahou no koodochenji, Nemure nai machi Higawari na jazz guitar Sotto mainaa de</div> <div id="right1">Some text. Chat itd .... bullshit</div><div id="right2">Anketa itd... </div><div id="right3">bla bla</div> <div id="footer">© Copyright 2009 Vse pravice pridržane</div></div> </body> </html>
Tisto vmes contenta je fill namesto lorem ipsum...
Hvala že vnaprej
sh4rk ::
Evo remake sm naredu tvoje vizije :o. Sm zacetnik tko ,da sm naredu to za prakso :D. Za morebitne napake kr komentirajte, da vidm, ce bi se dalo kako drugače narest določene stvari.
Lp Jure
Koda:
Lp Jure
Koda:
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> <html xmlns="http://www.w3.org/1999/xhtml"> <head> <meta http-equiv="Content-Type" content="text/html; charset=utf-8" /> <title>Untitled Document</title> <link rel="stylesheet" type="text/css" href="css5.css"> </head> <body> <div id="topblue"> <form action="" method="get"> <input type="text" name="text" value="Search..."> </form> </div> <div class="logotip">LOGOTIP </div> <div id="navbar"> <div id="center"> <ul> <li><a href="domov.html">Domov</a></li> <li><a href="onmeni.html">O meni</a></li> <li><a href="vodic.html">Vodiči</a></li> <li><a href="wiki.html">Wiki</a></li> <li><a href="forum.html">Forum</a></li> <li><a href="klepet.html">Klepet</a></li> <li id="kontakt"><a href="kontakt.html">Kontakt</a></li> </ul> </div> </div> <div id="logotip2"> </div> <div id="container"> <div id="paragraph"> <div id="para"> <h2> BLA BLA BLA </h2> <p> Kinou wa call sign, Zenbu, keitai de Kinou wa call sign, Zenbu, keitai de Norenai fuzz guitar Hen na kouen de Muchuu de motor bike, Kaze wo oikoshite Mikazuki wa hisuterii, Boku no ue de Chikyuu wa goorurain, Inu mo raion mo Kasei ni moving on. Nanka mendou de Yellow moon. I ma mo, mittsu, Kazoete, me wo akete Shadow moon Mada yume wo miteru Me wo mite, me wo mite, Se wo mukeainagara Me wo mite, tell me yes or no? Everyday everynight Omoi tsuku kotoba d e Kimi e no omoi wo ima sugu tsutaetai Everyday everynight Arifureta aizu de Chirakatta m ama no kimochi wo tsutaetai Kibun wa kaisei, kondo, issho ni Karada wo dakishimete, kin no kyoukai de Yellow moon Kaketa yozora dewa tsuki wa kyou mo Shizuka na kao de hikaru no sa Me wo mite, me wo mite, Se wo mukeainagara Me wo mite, tell me yes or no? Everyday everynight Omoi tsuku kotoba de Everyday everynight Kimi e no omoi wo tsutaeyou Everyda y Yellow moon. Ima mo, mittsu, Kazoete, me wo akete Shadow moon Mada yume wo miteru Me wo mite, me wo mite, Se wo muke ai nagara Me wo mite, itsu aeru? Everyday everynight Omoi tsu ku kotoba de Kimi e no omoi wo ima sugu tsutaetai Everyday everynight Arifureta aizu de Chira katta mama no kimochi wo, ima sugu Mahou no koodochenji, Nemure nai machi Higawari na jazz gui tar Sotto mainaa deKinou wa call sign, Zenbu, keitai de Norenai fuzz guitar Hen na kouen de Mu chuu de motor bike, Kaze wo oikoshite Mikazuki wa hisuterii, Boku no ue de Chikyuu wa goorurai </p> <hr /> <h2> Inu mo raion </h2> <p> mo Kasei ni moving on. Nanka mendou de Yellow moon. Ima mo, mittsu, Kazoete, me wo akete Shadow moon Mada yume wo miteru Me wo mite, me wo mite, Se wo mukeainagara Me wo mit , tell me yes or no? Everyday everynight Omoi tsuku kotoba de Kimi e no omoi wo ima sugu tsut Everyday everynight Arifureta aizu de Chirakatta mama no kimochi wo tsutaetai Kibun wa kaise i, kondo, issho ni Karada wo dakishimete, kin no kyoukai de Yellow moon Kaketa yozora dewa t suki wa kyou mo Shizuka na kao de hikaru no sa Me wo mite, me wo mite, Se wo mukeainagara Me wo mite, tell me yes or no? Everyday everynight Omoi tsuku kotoba de Everyday everynight Kimi e no omoi wo tsutaeyou Everyday Yellow moon. Ima mo, mittsu, Kazoete, me wo akete Shadow moon Mada yume wo miteru Me wo mite, me wo mite, Se wo muke ai nagara Me wo mite, itsu aeru? Everyday everynight Omoi tsuku kotoba de Kimi e no omoi wo ima sugu tsutaetai Everyday everynight Arifureta aizu de Chirakatta mama no kimochi wo, ima sugu Mahou no koodochenji, Nemure nai machi Higawari na jazz guitar Sotto mainaa deKinou wa call sign, Zenbu, keitai de Norenai fuzz guitar Hen na kouen de Muchuu de motor bike, Kaze wo oikoshite Mikazuki wa hisuterii, Boku no ue de Chikyuu wa goorurain, Inu mo raion mo Kasei ni moving on. Nanka mendou de Yellow moon. Ima mo, mittsu, Kazoete, me wo akete Shadow moon Mada yume wo miteru Me wo mite, me wo mite, Se wo mukeainagara Me wo mite, tell me yes or no? Everyday everynight Omoi tsuku kotoba de Kimi e no omoi wo ima sugu tsutaetai Everyday everynight Arifureta aizu de Chirakatta mama no kimochi wo tsutaetai Kibun wa kaisei, kondo, issho ni Karada wo dakishimete, kin no kyoukai de Yellow moon Kaketa yozora dewa tsuki wa kyou mo Shizuka na kao de hikaru no sa Me wo mite, me wo mite, Se wo mukeainagara Me wo mite, tell me yes or no? Everyday everynight Omoi tsuku kotoba de Everyday everynight Kimi e no omoi wo tsutaeyou Everyday Yellow moon. Ima mo, mittsu, Kazoete, me wo akete Shadow moon Mada yume wo miteru Me wo mite, me wo mite, Se wo muke ai nagara Me wo mite, itsu aeru? Everyday everynight Omoi tsuku kotoba de Kimi e no omoi wo ima sugu tsutaetai Everyday everynight Arifureta aizu de Chirakatta mama no kimochi wo, ima sugu Mahou no koodochenji, Nemure nai machi Higawari na jazz guitar Sotto mainaa de Norenai fuzz guitar Hen na kouen de Muchuu de motor bike, Kaze wo oikoshite Mikazuki wa hisuterii, Boku no ue de Chikyuu wa goorurain, Inu mo raion mo Kasei ni moving on. Nanka mendou de </p> <hr /> <p> Yellow moon. Ima mo, mittsu, Kazoete, me wo akete Shadow moon Mada yume wo miteru Me wo mite, me wo mite, Se wo mukeainagara Me wo mite, tell me yes or no? Everyday everynight Omoi tsuku kotoba de Kimi e no omoi wo ima sugu tsutaetai Everyday everynight Arifureta aizu de Chirakatta mama no kimochi wo tsutaetai Kibun wa kaisei, kondo, issho ni Karada wo dakishimete, kin no kyoukai de Yellow moon Kaketa yozora dewa tsuki wa kyou mo Shizuka na kao de hikaru no sa Me wo mite, me wo mite, Se wo mukeainagara Me wo mite, tell me yes or no? Everyday everynight Omoi tsuku kotoba de Everyday everynight Kimi e no omoi wo tsutaeyou Everyday Yellow moon. Ima mo, mittsu, Kazoete, me wo akete Shadow moon Mada yume wo miteru Me wo mite, me wo mite, Se wo muke ai nagara Me wo mite, itsu aeru? Everyday everynight Omoi tsuku kotoba de Kimi e no omoi wo ima sugu tsutaetai Everyday everynight Arifureta aizu de Chirakatta mama no kimochi wo, ima sugu Mahou no koodochenji, Nemure nai machi Higawari na jazz guitar Sotto mainaa de </p> </div> </div> <div id="wrapper"> <div class="anketa"> </div> <div class="anketa"> </div> </div> <div id="footer"> (C) Copyright 2009 Vse pravice pridržane </div> </div> </body> </html>
body { padding:0px; margin:0px; background:#00588d; } #topblue { width:1200px; height:30px; position:relative; margin:0 auto; top:0px; background:#04609a; } form { float:right; padding:5px; position:relative; } .logotip { width:700px; height:100px; background:#FFF; position:relative; margin-top:20px; margin-left:50px; padding-top:15px; font-size:25pt; font-weight:bold; border:2px solid #09F; } #navbar { width:100%; height:40px; margin-top:100px; border:1px solid; border-left:none; border-right:none; border-top-color:#3CF; border-bottom-color:#09F; } #center { width:720px; margin:0px auto; padding:0px; } #navbar ul { display:inline; list-style:none; } #navbar li { display:inline; display:block; float:left; width:97px; height:40px; list-style:none; text-align:center; } #navbar a { text-decoration:none; color:white; font-weight:bold; font-size:12pt; display:block; padding:10px; } #navbar a:hover { background-color:#035d8d; } #kontakt { float:left; } #logotip2 { width:700px; height:90px; background:#FFF; position:relative; margin-top:60px; margin-left:200px; font-size:25pt; font-weight:bold; border:2px solid #09F; } #container { padding:0px; width:900px; margin:0 auto; margin-top:50px; } #paragraph { margin:0px; padding:0px; width:650px; } #para { margin:15px; padding:10px; border:2px solid #09F; color:white; background:#014977; float:left; } h2 { padding-top:15px; } .anketa { height:400px; width:200px; margin:15px; padding:10px; border:2px solid #09F; color:white; background:#014977; margin-bottom:100px; } #wrapper { width:250px; float:left; } #footer { width:900px; padding:10px; margin-top:15px; float:left; text-align:center; border-top:1px solid; border-top-color:#3CF; }
Wolfman ::
Najlepša hvala, ampak danes znam tudi sam že narediti popolno stran ki vključuje tudi baze in PHP. Vseeno bo mogoče kdo potreboval
lp
lp
sh4rk ::
Hehe supr :D pol si ze kr delc prlezu :) Jst se še z html pa css matram tok, da si vsaj mal v mozgane utisnem, predn grem na naslednji korak. :).
Lp Jurko ^^
Lp Jurko ^^
Vredno ogleda ...
Tema | Ogledi | Zadnje sporočilo | |
---|---|---|---|
Tema | Ogledi | Zadnje sporočilo | |
! | Vse, kar ste si želeli vprašati o CSS, pa si niste upali. (strani: 1 2 3 4 … 23 24 25 26 )Oddelek: Izdelava spletišč | 347109 (6246) | sunniegoldie |
» | Prikaz strani na različni resoluciji-JoomlaOddelek: Izdelava spletišč | 1948 (1676) | kr?en |
» | poravnava li elementovOddelek: Izdelava spletišč | 2152 (2017) | boss-tech |
» | Wampserver in FirefoxOddelek: Izdelava spletišč | 1854 (1734) | jonystar |
» | [CSS]Pozicioniranje footer divaOddelek: Izdelava spletišč | 2462 (2409) | amaze646 |