| |
Uporabljam dive, kjer se diva prekrivata kar ne bi rad in ne vem kako to urediti....
<div class="main">Besedilo</div> (ena varijanta diva)
<div id="apdiv1">Besedilo</div> (druga varijanta diva kjer mu enostavno določiš vse le problem je, da se divi prekrivajo kar nočem, hočem da ko pišeš besedilo v divu, se spodnji div ki je pod njim premakne ne pa da gre preko njega. Pri tabelah vse deluje le moti me ker nimaš toliko enostavnih nastavitev glede borderjev kot jih pdi divih imaš npr. oglati koti..)
Kako sedaj temu prvemnu divu določim velikost, širino, border…ali kakšen drug način…najraje bi videl varijanto za drugi div, da se ne bi prekrivala ampak bi imela enako funkcijo kot prva dva diva.
Rad bi naredil Dive v vodoravni postavitvi. Več divov iz leve proti desni in da je kompletna stran na sredini. Dal sem dive na relativ, vendar ko dam naslednji div mi ga da pod obstoječi div in ne vem kako ga dam zraven da je na desni poleg obstoječega diva. Skratka rad, bi postavil tri dive vodoravno in bi bili na sredini spletne strani ter v kolikor pišem tekst v prvem divu, da ostaneta druga dva diva ne enaki poziciji, ne pa da se pomikata navzdol glede na pisanje teksta iz prvega diva. Delam z Adobe Dremweaverom CS5. Že v naprej se prav lepo zahvaljujem.
spremenil: NikMan (30.11.2011 ob 11.47.22)
|
| |
| |
Če hočeš imeti vse skupaj na sredini, naredi div z imenom glavni-del ter mu določi margin:auto; in pa širinino, ki jo boš uporabil.
Da se ti div-i ne bodo prekrivali, uporabi margin (nek objekt bo od drugega objekta odmaknjen toliko, koliko mu boš nastavil vrednost) in float:left;, da boš imel div-e v vodorovni vrstici od leve proti desni.
Še primer kode:
<html>
<head>
<style>
#glavni-del {
margin:auto;
width:480px;
}
#vsebina1 {
float:left;
height:100px;
width:100px;
background-color:#000000;
margin:10px;
}
#vsebina2 {
float:left;
height:100px;
width:100px;
background-color:#000000;
margin:10px;
}
#vsebina3 {
float:left;
height:100px;
width:100px;
background-color:#000000;
margin:10px;
}
#vsebina4 {
float:left;
height:100px;
width:100px;
background-color:#000000;
margin:10px;
}
</style>
</head>
<body>
<div id ="glavni-del">
<div id ="vsebina1"></div>
<div id ="vsebina2"></div>
<div id ="vsebina3"></div>
<div id ="vsebina4"></div>
</div>
</body>
</html>
In pa slika, kako izgleda v brskalniku (za div-e sem uporabil prazne črne kvadrate):
|
| |
| |
Odlično najlepša hvala. Nekaj bi še vprašal. V glavnem delu je width:480px
Mar to pomeni, da je dolžina vseh stolpcev 480 z odmikom ali si narobe razlagam.Ali se pri tem nastavi velikost strani... Stvar deluje, tako da res hvala na hitrem odzivu. Sedaj sem naredil dva stolpca vodoravno po tem zapisu. Kako sedaj nadaljujem, da mi daje dive pod dive, tako da pod prvi stolpec naredim še dva diva navzdol in ne vodoravno.Hvala že v naprej za razlago.
spremenil: lala2000 (30.11.2011 ob 18.57.12)
|
| |
| |
Takšno širino sem uporabil zato, da ti na primeru čim lažje predstavim kako se to naredi.
Če hočeš imeti vrstico pod vrstico, boš moral narediti toliko div-ov kot boš imel vrstic. Div-i naj bodo iste širine kot glavni del, vsebovati pa morajo clear:both; (da v mojem primeru črni kvadrati sploh skočijo v novo vrstico. Če tega nebi dodali, bi se kvadrati nadaljevali v isti vrstici). Jaz sem naredil div-e z imeni del1 (prva vrstica), del2 (druga vrstica), del3 (tretja vrstica).
Še koda, ki je zdaj nekoliko daljša:
<html>
<head>
<style>
#glavni-del {
margin:auto;
width:900px;
}
#del1 {
width:900px;
}
#del2 {
margin-top:20px;
width:900px;
clear:both;
}
#del3 {
margin-top:20px;
width:900px;
clear:both;
}
#vsebina1 {
float:left;
height:100px;
width:100px;
background-color:#000000;
margin:10px;
}
#vsebina2 {
float:left;
height:100px;
width:100px;
background-color:#000000;
margin:10px;
}
#vsebina3 {
float:left;
height:100px;
width:100px;
background-color:#000000;
margin:10px;
}
#vsebina4 {
float:left;
height:100px;
width:100px;
background-color:#000000;
margin:10px;
}
#vsebina5 {
float:left;
height:100px;
width:100px;
background-color:#000000;
margin:10px;
}
#vsebina6 {
float:left;
height:100px;
width:100px;
background-color:#000000;
margin:10px;
}
#vsebina7 {
float:left;
height:100px;
width:100px;
background-color:#000000;
margin:10px;
}
#vsebina8 {
float:left;
height:100px;
width:100px;
background-color:#000000;
margin:10px;
}
</style>
</head>
<body>
<div id ="glavni-del">
<div id ="del1">
<div id ="vsebina1"></div>
<div id ="vsebina2"></div>
<div id ="vsebina3"></div>
</div>
<div id ="del2">
<div id ="vsebina4"></div>
<div id ="vsebina5"></div>
</div>
<div id ="del3">
<div id ="vsebina6"></div>
<div id ="vsebina7"></div>
<div id ="vsebina8"></div>
</div>
</div>
</body>
</html>
In pa primer v brskalniku:
spremenil: .lolo (30.11.2011 ob 18.28.16)
|
| |
| |
Najlepša hvala za bliskovit odziv. Bom takoj preizkusil, da vidim če me bo še kje zezalo.
Zraven sestavka dajem dopolnilo. Sedaj deluje zadeva odlično in resnična hvala moderatorju za neverjetno hiter odziv ter pohvali sami strani, kjer lahko vsakdo napiše svoj problem ali prebere, kjer je kdo imel kakšno težavo in s s tem tudi sam poduči. Skratka vse pohvale tako dobri strani in upajmo, da pridobi veliko dobrih sponzorjev za svoj obstoj.
spremenil: lala2000 (1.12.2011 ob 00.22.46)
|
| |
| |
Ajej, se mi je na koncu nekaj zapletlo. Na začetku je vse OK, na koncu kjer pride besedilo pri div-u pa se spodnji na nasprotni strani pomika enako z njim. Sem priložil sliko, da bo lažje razumljivo. Hval za trud že v naprej.
spremenil: .lolo (1.12.2011 ob 13.42.30)
|
| |
| |
Ne vem kjer delam napako??? V drugem delu sem malce spreminjal, vendar je še vedno ni bilo dobro. Od začetka je bilo vse enako zapisano kot v prvem delu. V prvem delu kjer je tekst dela vse normalno, v drugem delu pa me heca.
Uporabljam gumb uredi objavo, vendar sem naložil sliko, ki ni bila v pravem formatu in nisem mogel ponovno naložit druge slike oziroma ne vem kako se jo naloži brez, da bi odprl novo rubriko.
Hočem zbrisat objavo pa je ni možno, se opravičujem za nevšečnosti.
spremenil: lala2000 (1.12.2011 ob 13.59.11)
|
| |
| |
Narediš povsem podobno kot je bilo zdaj, razen vodoravnih vrstic (to so del1, del2, del3) ustvari navpične stolpce.
Naredi štiri div-e del ter jim določi naslednje lastnosti:
margin-top:20px;
width:225px;
float:left;
Naredi še štiri div-e vsebina in tudi tem določi lastnosti, ki so navedene spodaj:
float:left;
height:auto;
width:210px;
margin:10px;
|
| |
| |
Očitno nisem dobro razumel. Rad bi, popolnoma enako zgradbo kot je na sliki, le da ne vem kaj naredit v spodnjem delu kjer prihaja do zamikanj. To se pravi, da prve tri pustim pri miru in spremenim ostale po vrstnem redu, če sem prav razumel? Ti ukazi so torej za pokončne stolpce, če prav razumem...
Vse mi je šlo križem kražem. Lahko prosim celoten zapis kode, kot je bilo zapisano v prvem primeru "primer kode". Se mučim in mi da stolpce enkrat sem drugič tja. Vse dela super le v spodnjem delu me zeza. Čudno, da je princip v zgornjem delu enak pa dela vse normalno, glede na spodnjega kjer zeza.
Ponovno skušal dodajat te kode, vendar se mi vse zmeša. Prosil bi za kompletno kodo, ker se še lovim pri vsem tem. Prva stran je narejena, le to spodaj me zeza...
Sem rešil zadevo na malo drugi način, ni po postopku kot bi moralo, vendar vseeno deluje to kar bi rad. Vseeno vsem hvala za pomoč, če se pa kdo najde pa bi rade volje videl, da sem napiše celotno kodo.
Pozdrav celotni ekipi !!!
spremenil: lala2000 (1.12.2011 ob 20.10.20)
|
| |
| |
Tudi jaz ne napišem pravilne kode vedno s prve. Zato malo poizkušaj kaj bo delalo in kaj bo bolje, ne pa kode samo kopirat s foruma in si misliti, da nekaj znaš.
Sem ti naložil še html datoteko, v kateri je primer kakršnega želiš sam. Prenesi si to datoteko in se malo igraj s kodo.
http://www.mediafire.com/?8qu285utlfz9g5....
spremenil: .lolo (1.12.2011 ob 22.23.13)
|
| |
Prikazujem 1 od skupno 3 strani |
|
