DevProTalk

Forumi IT profesionalaca
web development, web design, e-business, SEO


Idite nazad   DevProTalk > Web development i web aplikacije > (X)HTML, JavaScript, DHTML, XML, CSS
Želite da se reklamirate ekskluzivno na ovoj poziciji? Javite se

(X)HTML, JavaScript, DHTML, XML, CSS Client scripting tehnologije, Dynamic HTML, Cascading Stylesheets, XML i standardi

Odgovori
 
Alati teme Način prikaza
Staro 19. 05. 2008.   #1
ljtruba
old school
Expert
 
Datum učlanjenja: 14.10.2006
Poruke: 460
Hvala: 39
17 "Hvala" u 14 poruka
ljtruba is on a distinguished road
Default Double float problem - resen, ali ima dodatni problem :0

Napravio sam nesto ovako

Kôd:
<div id="container">
<div id="stripe"><img src="images/header.jpg" alt="header" /></div>
<div id="stripe"><img src="images/kategorije.jpg" alt="kategorije" /></div>
<div id="left">
<div id="navigation">
:: <a href="onama.php">O nama</a><br />
</div>
</div>
<div id="right">
<div id="navigation">
:: <a href="vesti.php">Vesti</a><br />
</div>
</div>
<div id="stripe"><img src="images/novo.jpg" alt="forum" /></div>
a CSS je
Kôd:
#container{
width: 320px; /*The width of our layout*/
margin-left: auto;
margin-right: auto;
text-align: left; 
}

#stripe{
	width: 320px;
	height: 24px;
	margin-left: auto;
	margin-right: auto;
	display: inline;
	margin-top: 10px;
	margin-bottom: 10px;
}
#navigation{
color: #2876c0;
margin-bottom: 10px;
}

#left{
width: 150px;
float: left;
}

#right{
width: 150px;
float: right;
}
Dakle, pre nego sto sam u #stripe ubacio display: inline;
imao sam standardni double float problem, ali kad sam ubacio diplay::inline sada mi vise ne radi
margin-top: 10px;
margin-bottom: 10px;

Kako ovo da resim, trebaju mi te margine.
Hvala
ljtruba je offline   Odgovorite uz citat
Staro 19. 05. 2008.   #2
bluesman
Goran Pilipović
Sir Write-a-Lot
 
Avatar bluesman
 
Datum učlanjenja: 18.05.2005
Lokacija: Beograd
Poruke: 5.450
Hvala: 288
1.247 "Hvala" u 446 poruka
bluesman je osoba koju treba slušatibluesman je osoba koju treba slušatibluesman je osoba koju treba slušatibluesman je osoba koju treba slušatibluesman je osoba koju treba slušatibluesman je osoba koju treba slušatibluesman je osoba koju treba slušatibluesman je osoba koju treba slušatibluesman je osoba koju treba slušati
Pošaljite ICQ poruku za bluesman
Default

A šta treba da dobiješ? Koliko vidim ti imaš ovaj stripe (koji treba da bude class a ne id ako ćeš ovako da ga koristiš) koji ima širinu 320px... a onda imaš layout koji je širine 320px i pokušavaš da zbudžiš stripe između 2 floata po 150px... to je 2 x 150 + 320 = 620px ... pa kada još dodaš margine... mislim da ti je container previše uzak.

... a opet... nisi objasnio (ili ja ne razimem) šta želiš da dobiješ.
__________________
Goran Pilipović a.k.a. Ugly Fingers Bradley f.k.a. bluesman
I don't always know what I'm talking about but I know I'm right!
bluesman je offline   Odgovorite uz citat
Staro 19. 05. 2008.   #3
xippi
xippster
Master
 
Avatar xippi
 
Datum učlanjenja: 16.06.2005
Lokacija: Beograd
Poruke: 681
Hvala: 102
138 "Hvala" u 84 poruka
xippi će postati "faca" uskoroxippi će postati "faca" uskoro
Default

^^ + ovaj navigation bi isto trebao da je klasa. id je jedinstveni indetifikator na stranici tako da bi trebao da postoji samo jedan. ako imas vise elemenata koji treba da se ponasaju isto onda stavis klasu

nisam siguran sta zelis postici sa ovim inline elementima ali njima ne mozes staviti gornju i donju marginu, vec samo levo i desno. za vise pogledaj ovde. takodje, ako imas dva elementa koja floatuju i hoces treci da postavis ispod njih on mora da ima property clear:both (ili clear:left, clear:right... sta si vec koristio na prethodna dva)
xippi je offline   Odgovorite uz citat
Staro 19. 05. 2008.   #4
Zero-Cool
profesionalac
Qualified
 
Avatar Zero-Cool
 
Datum učlanjenja: 13.06.2005
Lokacija: Novi Sad
Poruke: 185
Hvala: 9
16 "Hvala" u 12 poruka
Zero-Cool is on a distinguished road
Pošaljite poruku preko Skype™ za Zero-Cool
Default

Evo malo sam ti prepravio kod, Ovako bi trebalo da izgleda da je ispravno napisano, sad ti to stavi kod sebe pa vidi jel to ono sto si ti hteo da dobijes ako nije onda ces morati da nacrtas tacno kako treba da izgleda pa ce ti vec neko objasniti.

xhtml:
Kôd:
<div id="container">
<div class="stripe"><img src="images/header.jpg" alt="header" /></div>
<div class="stripe"><img src="images/kategorije.jpg" alt="kategorije" /></div>
<div id="left">
<div class="navigation">
:: <a href="onama.php">O nama</a><br />
</div>
</div>
<div id="right">
<div class="navigation">
:: <a href="vesti.php">Vesti</a><br />
</div>
</div>
<br class="clearfloat" />
<div class="stripe"><img src="images/novo.jpg" alt="forum" /></div>
</div>
css:
Kôd:
#container{
             width: 320px; /*The width of our layout*/
             margin:0 auto;
             padding:0px;
             text-align: left; 
}

#stripe{
	width: 320px;
	height: 24px;
             padding:0px;
             margin: 10px auto;
}
#navigation{
             color: #2876c0;
             margin-bottom: 10px;
             padding:0px;
}

#left{
             width: 150px;
             float: left;
}

#right{
             width: 150px;
             float: right;
}
.clearfloat {
             clear:both;
             height:0;
             font-size: 1px;
             line-height: 0px;
}
Eto tako bi trebalo da izgleda, e sad sta ti tacno hoces da postignes ja i dalje nemam pojma moras malo vise da se potrudis da objasnis da bi te razumeli. Inace nisi imao zatvoren #container div u kodu koji si gore postavio, pored onih gresaka koje su blues i xippi pomenuli.
__________________
Mess with the best die like rest!!!
Zero-Cool je offline   Odgovorite uz citat
Staro 19. 05. 2008.   #5
ljtruba
old school
Expert
 
Datum učlanjenja: 14.10.2006
Poruke: 460
Hvala: 39
17 "Hvala" u 14 poruka
ljtruba is on a distinguished road
Default

Ovo mi je prvi xHTML koji radim, pa se izvinjavam na greskama, ajmo ispocetka.

Kôd:
<body>
<div id="container">
<div class="stripe"><img src="images/header.jpg" alt="header" /></div>
<div class="stripe"><img src="images/kategorije.jpg" alt="kategorije" /></div>
<div id="left">
<div class="navigation">
:: <a href="magazin.php">Magazin</a><br />
:: <a href="pretplata.php">Pretplata</a><br />
:: <a href="redakcija.php">Redakcija</a><br />
:: <a href="onama.php">O nama</a><br />
:: <a href="marketing.php">Marketing</a>
</div>
</div>
<div id="right">
<div class="navigation">
:: <a href="vesti.php">Vesti</a><br />
:: <a href="linkovi.php">Linkovi</a><br />
:: <a href="oglasivaci.php">Oglašivači</a><br />
:: <a href="reportaze.php">Reportaže</a><br />
:: <a href="intervjui.php">Intervjui</a>
</div>
</div>
<br class="clearfloat" />
<div class="stripe"><img src="images/novonaforumu.jpg" alt="forum" /></div>
<div id="banner"><img src="images/baner.gif" alt="banner" /></div>
<div class="stripe"><img src="images/footer.jpg" alt="footer" /></div>
</div>
</body>
</html>

CSS
Kôd:
#container{
width: 320px; /*The width of our layout*/
margin-left: auto;
margin-right: auto;
text-align: left;
}

#stripe{
	width: 320px;
	height: 24px;
	padding:0px;
    margin: 10px auto;
}

#banner{
width: 300px;
height: 75px;
margin-left: auto;
margin-right: auto;
}

#navigation{
color: #2876c0;
margin-bottom: 10px;
padding:0px;
}

#left{
width: 150px;
float: left;
}

#right{
width: 150px;
float: right;
}

#magazin{
float: right;
margin: 0 0 10px 10px;
border: 1px solid #666;
padding: 2px;
}

.clearfloat {
             clear:both;
             height:0;
             font-size: 1px;
             line-height: 0px;
}
A pokusavam da napravim prored iznad i ispod svih elemenata, da malo disu.
Evo sta pokusavam.
Priloženi thumbnailovi
Kliknite na sliku za uvećanu verziju

Naziv:	wap-hi-files.jpg
Pregleda:	1100
Veličina:	26,3 KB
ID:	556  
ljtruba je offline   Odgovorite uz citat
Staro 19. 05. 2008.   #6
xippi
xippster
Master
 
Avatar xippi
 
Datum učlanjenja: 16.06.2005
Lokacija: Beograd
Poruke: 681
Hvala: 102
138 "Hvala" u 84 poruka
xippi će postati "faca" uskoroxippi će postati "faca" uskoro
Default

html:

Kôd:
<div id="container">
<div class="stripe">heder</div>
<div class="stripe">kategorije</div>
<div id="left">
	<ul class="navigation">
		<li><a href="magazin.php">Magazin</a></li>
		<li><a href="pretplata.php">Pretplata</a></li>
		<li><a href="redakcija.php">Redakcija</a></li>
		<li><a href="onama.php">O nama</a></li>
		<li><a href="marketing.php">Marketing</a></li>
	</ul>
</div>
<div id="right">
	<ul class="navigation">
		<li><a href="vesti.php">Vesti</a></li>
		<li><a href="linkovi.php">Linkovi</a></li>
		<li><a href="oglasivaci.php">Oglašivači</a></li>
		<li><a href="reportaze.php">Reportaže</a></li>
		<li><a href="intervjui.php">Intervjui</a></li>
	</ul>
</div>
<div class="stripe">novo na forumu</div>
<div id="banner">baner</div>
<div class="stripe">futer</div>
</div>
css:

Kôd:
#container{
	 width: 320px; /*The width of our layout*/
	 margin:0 auto;
	 padding: 0;
}

.stripe{
	width: 320px;
	height: 24px;
	padding: 0px;
	margin: 0 auto 10px auto;
	clear: both;
	background: red;
}
.navigation {
	margin: 0px;
	padding: 0px;
	list-style: none;
}

.navigation a {
	color: #2876c0;
}

#left{
	width: 150px;
	float: left;
	margin: 0 0 10px 0; /* top right bottom left */
}

#right{
	width: 150px;
	float: right;
	margin: 0 0 10px 0;
}

#banner {
	margin: 0 0 10px 0;
}
xippi je offline   Odgovorite uz citat
"Hvala" xippi za poruku:
Staro 19. 05. 2008.   #7
Zero-Cool
profesionalac
Qualified
 
Avatar Zero-Cool
 
Datum učlanjenja: 13.06.2005
Lokacija: Novi Sad
Poruke: 185
Hvala: 9
16 "Hvala" u 12 poruka
Zero-Cool is on a distinguished road
Pošaljite poruku preko Skype™ za Zero-Cool
Default

e sad je mnogo jasnije sta hoces, elem onda sam ti dobro napisao gore i ispravio tvoj kod jedino sto sam napravio gresku u css-u jer sam prevideo da treba da izmenim # sa . kod class-a.

Kôd:
<div id="container">
<div class="stripe"><img src="images/header.jpg" alt="header" /></div>
<div class="stripe"><img src="images/kategorije.jpg" alt="kategorije" /></div>
<div id="left">
<div class="navigation">
:: <a href="magazin.php">Magazin</a><br />
:: <a href="pretplata.php">Pretplata</a><br />
:: <a href="redakcija.php">Redakcija</a><br />
:: <a href="onama.php">O nama</a><br />
:: <a href="marketing.php">Marketing</a>
</div>
</div>
<div id="right">
<div class="navigation">
:: <a href="vesti.php">Vesti</a><br />
:: <a href="linkovi.php">Linkovi</a><br />
:: <a href="oglasivaci.php">Oglašivači</a><br />
:: <a href="reportaze.php">Reportaže</a><br />
:: <a href="intervjui.php">Intervjui</a>
</div>
</div>
<br class="clearfloat" />
<div class="stripe"><img src="images/novonaforumu.jpg" alt="forum" /></div>
<div id="banner"><img src="images/baner.gif" alt="banner" /></div>
<div class="stripe"><img src="images/footer.jpg" alt="footer" /></div>
</div>
Kôd:
#container{
width: 320px; /*The width of our layout*/
margin-left: auto;
margin-right: auto;
text-align: left;
}

.stripe{
	width: 320px;
	height: 24px;
	padding:0px;
             margin: 10px auto;
}

.banner{
             width: 300px;
             height: 75px;
             margin-left: auto;
             margin-right: auto;
}

.navigation{
             color: #2876c0;
             margin-bottom: 10px;
             padding:0px;
}

#left{
             width: 100px;
             float: left;
}

#right{
             width: 100px;
             float: left;
             margin-left:20px; /* udaljenost od leve kolone linkova*/
}

#magazin{
             width: xxx px; /* dodaj ovom elementu width jer bez toga ce ti se poremetiti float */ /* a u xhtml kodu obavezno posle ovog elementa stavi <br class="clearfloat" /> */
             float: right;
             margin: 0 0 10px 10px;
             border: 1px solid #666;
             padding: 2px;
}

.clearfloat {
             clear:both;
             height:0;
             font-size: 1px;
             line-height: 0px;
}
</style>
__________________
Mess with the best die like rest!!!
Zero-Cool je offline   Odgovorite uz citat
Staro 19. 05. 2008.   #8
ljtruba
old school
Expert
 
Datum učlanjenja: 14.10.2006
Poruke: 460
Hvala: 39
17 "Hvala" u 14 poruka
ljtruba is on a distinguished road
Default

hmmm. hvala, imam ja jos da ucim
ljtruba je offline   Odgovorite uz citat
Staro 03. 06. 2008.   #9
ljtruba
old school
Expert
 
Datum učlanjenja: 14.10.2006
Poruke: 460
Hvala: 39
17 "Hvala" u 14 poruka
ljtruba is on a distinguished road
Default

Pozdrav,
evo igrao sam se još malo pa sam hteo da se malo pohvalim sa dosadašnjim radom.
Naravno, nije sve gotovo, treba da uradim još 4 stranice, a imam i problem sa utf-8

Pogledajte sajt na wap.hi-files.com

Da li neko može da mi objasni zašto dobijam one upitnike u kvadratima?
Stavio sam koding stranice na utf-8 a podatke vučem iz baze.
ljtruba je offline   Odgovorite uz citat
Staro 03. 06. 2008.   #10
ljtruba
old school
Expert
 
Datum učlanjenja: 14.10.2006
Poruke: 460
Hvala: 39
17 "Hvala" u 14 poruka
ljtruba is on a distinguished road
Default

I javite mi da li mi je xHTML/CSS ispravan, jer sam tek ušao u svet bez tabela.
ljtruba je offline   Odgovorite uz citat
Odgovori


Alati teme
Način prikaza

Pravila pisanja
Možete ne započinjati nove teme
Možete ne slati odgovore
Možete ne slati priloge
Možete ne izmeniti svoje poruke
vB kôd je Uključen
Smajliji su Uključen
[IMG] kod je Uključen
HTML kôd je Isključen
Pogledajte forum

Slične teme
Tema Početna poruka teme Forum Odgovori Poslednja poruka
SEO: dodatni domeni? ivanhoe Marketing i SEO 14 16. 08. 2010. 19:18
Double Click bojan.pejanovic Marketing i SEO 0 20. 10. 2009. 16:35
Double pointers - C (Cudno!) orangem Programiranje 4 15. 02. 2009. 21:21
IE background flicker RESEN !!! ivanhoe (X)HTML, JavaScript, DHTML, XML, CSS 1 29. 09. 2006. 10:51
IE i rendering kad se koristi float nixa (X)HTML, JavaScript, DHTML, XML, CSS 11 25. 01. 2006. 23:08


Vreme je GMT +2. Trenutno vreme je 06:11.


Powered by vBulletin® Verzija 3.6.8
Copyright ©2000 - 2024, Jelsoft Enterprises Ltd.
Copyright © DevProTalk. All Rights Reserved.
Mišljenja, saveti, izjave, ponude ili druge informacije ili sadržaji nastali na Sajtu su vlasništvo onoga ko ih je kreirao, a ne DevProTalk.com, tako da ne morate da se oslanjate na njih.
Autori poruka su jedini odgovorni za ovakve sadržaje. DevProTalk.com ne garantuje tačnost, kompletnost ili upotrebnu vrednost informacija, stavova, saveta ili datih izjava. Ne postoje uslovi pod kojima bi mi bili odgovorni za štetu ili gubitak koji je posledica bilo čijeg oslanjanja na nepouzdane informacije, ili bilo kakve informacije nastale kroz komunikaciju između registrovanih članova.
Web sajt može sadržavati linkove na druge web sajtove na Internetu ili neke druge sadržaje. Ne kontrolišemo niti podržavamo te druge web sajtove, niti smo pregledali bilo kakve sadržaje na takvim sajtovima. Mi nećemo biti odgovorni za legalnost, tačnost ili prikladnost bilo kog sadržaja, oglasa, proizvoda, usluga ili informacije lociranim na ili distribuiranih kroz druge web sajtove, niti za bilo kakvu štetu nastalu kao posledica takvih informacija. DevProTalk.com drži i čuva druga prava vlasništva na web sajtu. Web sajt sadrže materijale zaštićene copyright-om, zaštitne znakove i druge informacije o pravu vlasništva ili softver. Članovi mogu poslatu informacije zaštićene pravima vlasništva njihovih nosilaca i ona ostaju zaštićena bez obzira da li su oni koji prenose te informacije to naveli ili ne. Osim informacija koje su u javnom vlasništvu ili za koje dobijete dozvolu, nemate pravo da kopirate, modifikujete ili na bilo koji način menjate, objavljujete, prenosite, distribuirate, izvršavate, prikazujete ili prodajte bilo koju informaciju zaštićenu pravima vlasništva. Slanjem informacija ili sadržaja na bilo koji deo DevProTalk.com, Vi automatski dozvoljavate i predstavljate garanciju da imate pravo da dozvolite DevProTalk.com ili članovima DevProTalk.com bespovratnu, kontinualnu, neograničenu, globalnu dozvolu da koriste, kopiraju, izvršavaju, prikazuju i distribuiraju takve informacije i sadržaje i da iz takvih sadžaja koriste bilo koji deo u bilo koje svrhe, kao i pravo i dozvolu da koriste gore navedene sadržaje. Svi zaštitni znakovi (trademarks), logotipi, oznake usluga, firme ili imena proizvoda koji se pominju na ovom web sajtu su vlasništvo kojim raspolažu njihovi vlasnici.