DW - kako sa ćelijom

Raub · 2.12.2008, 18:49

Ljudi,molim vas kako da rešim problem sa ćelijom.Želim da ubacim konkretno kod za google serach,sce to lepo odradim ali mi se search ne nalazi unutar već van ćelije,i to nije slučaj samo sa kodom već i kad' ubacim flash animaciju sve to meni izlazi van okvira ćelije.Pomozite ako boga znate.

holodoc · 2.12.2008, 20:55

"Daj malo koda sestro..."

Raub · 2.12.2008, 21:03

Kod:

<!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>
<style type="text/css">
<!--
body,td,th {
    font-family: Georgia, Times New Roman, Times, serif;
    color: #333;
}
#apDiv1 {
    position:absolute;
    width:223px;
    height:43px;
    z-index:1;
    top: 227px;
    left: 750px;
}
#apDiv2 {
    position:absolute;
    width:200px;
    height:115px;
    z-index:2;
    left: 759px;
    top: 286px;
}
-->
</style>
</head>

<body text="#333333" link="#993300" vlink="#993300" alink="#993300">
<div align=center>
<table width="800"  border="0" align="center">
<tr>
<td><img src="images/layout_01.gif" width="303" height="152" /><img src="images/layout_02.gif" width="211" height="152" /><img src="images/layout_03.gif" width="269" height="152" /></td>
</tr>
</table>
</div>
<div align=center>
<table width="806" border="0" align="center">
<tr>
<td><img src="images/layout_04.gif" width="92" height="36" /><img src="images/layout_05.gif" width="18" height="36" /><img src="images/layout_06.gif" width="69" height="36" /><img src="images/layout_07.gif" width="19" height="36" /><img src="images/layout_08.gif" width="80" height="36" /><img src="images/layout_09.gif" width="17" height="36" /><img src="images/layout_10.gif" width="97" height="36" /><img src="images/layout_11.gif" width="17" height="36" /><img src="images/layout_12.gif" width="102" height="36" /><img src="images/layout_13.gif" width="22" height="36" /><img src="images/layout_14.gif" width="173" height="36" /><img src="images/layout_15.gif" width="90" height="36" /></td>
</tr>
</table>
<div align=center><table width="800" border="1" align="center" cellpadding="20">
<tr>
<td width="551" height="800" align="center">&nbsp;</td>
<td width="233" height="800">
<div id="apDiv1"><form action="http://www.zanat.rs/Pages/Google.html" id="cse-search-box">
  <div>
<input type="hidden" name="cx" value="014174298231988165728:4ncz52dfq38" />
<input type="hidden" name="cof" value="FORID:10" />
<input type="hidden" name="ie" value="UTF-8" />
<input type="text" name="q" size="15" />
<input type="submit" name="sa" value="Traži" />
</div>
</form>
<script type="text/javascript" src="http://www.google.com/coop/cse/brand?form=cse-search-box&lang=en"></script>
</div></td>
</tr>
</table>
<div align=center><table width="800" border="1">
<tr>
<td width="552" height="100"><img src="images/footer552.gif" width="552" height="100" /></td>
<td width="232"><img src="images/footer232.gif" width="232" height="100" /></td>
</tr>
</table>
</div>
</div>
</div>
</body>
</html>

holodoc · 2.12.2008, 21:40

Kada radiš u Dreamweaveru uvek vodi računa da će pomoćne ikonice da ti utiču na krajnji izgled šablona. Dakle pre nego što pomisliš da si završio posao kako treba pritisni kombinaciju CTRL+SHIFT+I u FW-u da bi isključio sva pomoćna sredstva kako bi video kako će stvarno stranica da ti bude izrendana...u većini slučajeva. Kod tebe je problem što pokušavaš apsolutno pozicioniranim DIV kontejnerom da se ušteliš u postojeći layout... Bad thing to do my young Padawan...

Div kontejneri se skoro nikada ne pozicioniraju apsolutno u slučajevima kada je važna fluidnost layouta. Da ne dužim... Evo kako bi tvoj kod trebao da izgleda....

Kod:

<!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>
<style type="text/css">
<!--
body,td,th {
	font-family: Georgia, Times New Roman, Times, serif;
	color: #333;
}
#apDiv1 {
	position:absolute;
	width:223px;
	height:43px;
	z-index:1;
	top: 227px;
	left: 750px;
}
#apDiv2 {
	position:absolute;
	width:200px;
	height:115px;
	z-index:2;
	left: 759px;
	top: 286px;
}
-->
</style>
</head>

<body text="#333333" link="#993300" vlink="#993300" alink="#993300">
<div align=center>
<table width="800"  border="0" align="center">
<tr>
<td><img src="images/layout_01.gif" width="303" height="152" /><img src="images/layout_02.gif" width="211" height="152" /><img src="images/layout_03.gif" width="269" height="152" /></td>
</tr>
</table>
</div>
<div align=center>
<table width="806" border="0" align="center">
<tr>
<td><img src="images/layout_04.gif" width="92" height="36" /><img src="images/layout_05.gif" width="18" height="36" /><img src="images/layout_06.gif" width="69" height="36" /><img src="images/layout_07.gif" width="19" height="36" /><img src="images/layout_08.gif" width="80" height="36" /><img src="images/layout_09.gif" width="17" height="36" /><img src="images/layout_10.gif" width="97" height="36" /><img src="images/layout_11.gif" width="17" height="36" /><img src="images/layout_12.gif" width="102" height="36" /><img src="images/layout_13.gif" width="22" height="36" /><img src="images/layout_14.gif" width="173" height="36" /><img src="images/layout_15.gif" width="90" height="36" /></td>
</tr>
</table>
<div align=center><table width="800" border="1" align="center" cellpadding="20">
<tr>
<td width="551" height="800" align="center">&nbsp;</td>
<td width="233" height="800">
<div id="apDiv1"><form action="http://www.zanat.rs/Pages/Google.html" id="cse-search-box">
  <div>
<input type="hidden" name="cx" value="014174298231988165728:4ncz52dfq38" />
<input type="hidden" name="cof" value="FORID:10" />
<input type="hidden" name="ie" value="UTF-8" />
<input type="text" name="q" size="15" />
<input type="submit" name="sa" value="Traži" />
</div>
</form>
<script type="text/javascript" src="http://www.google.com/coop/cse/brand?form=cse-search-box&lang=en"></script>
</div></td>
</tr>
</table>
<div align=center><table width="800" border="1">
<tr>
<td width="552" height="100"><img src="images/footer552.gif" width="552" height="100" /></td>
<td width="232"><img src="images/footer232.gif" width="232" height="100" /></td>
</tr>
</table>
</div>
</div>
</div>
</body>
</html>

Sve što je trebalo da uradiš je da pomeriš kontejner ApDiv1 malo ulevo da sadržaj ne bi izlazio desno. Takođe, nikada se ne oslanjaj na dužinu tekstualnih polja da bude ista u svim browserima. To ne može da bude.

Generalno ovako može da posluži ali previše mešaš tabele i DIV kontejnere tako da ako nameravaš da se ozbiljnije pozabaviš web dizajnom obrati pažnju malo više na CSS

Raub · 2.12.2008, 22:02

Ok, znači sve objekte koje budem unosio da ih unosim malo levo

kako bi sve bilo dobro.oprosti mi molim te ali ako se sada ne naučim nikada neću izrada ovog sajta mi je pitanje života,ne zezam se, da imam kintu ne bih vas ovde smarao.

holodoc · 2.12.2008, 22:23

Citat:

Raub kaže:

Ok, znači sve objekte koje budem unosio da ih unosim malo levo

kako bi sve bilo dobro.oprosti mi molim te ali ako se sada ne naučim nikada neću izrada ovog sajta mi je pitanje života,ne zezam se, da imam kintu ne bih vas ovde smarao.

Ne da ih unosiš malo levo nego da na netu probaš da nađeš neke dobre tutorijale o pravom čistom CSS-u i naučiš kako da ih koristiš...

Predlažem... http://css.maxdesign.com.au/

Raub · 2.12.2008, 22:27

...znači CSS mi je rešenje a jedno od toga je i float css,jel tako

holodoc · 2.12.2008, 22:41

Citat:

Raub kaže:

...znači CSS mi je rešenje a jedno od toga je i float css,jel tako

Priznajem CSS je malko teže naučiti jer treba relativno dosta vremena da se nauče sve cake i cakice ali jednom naučen nećeš ga više napuštati

Kad smo već kod float-ova... Oni su veoma korisni ali imaju svojih prednost i mana

Raub · 2.12.2008, 22:59

Sve u svemu hvala ti holodoc,idem da se obrazujem i mislim da ću nešto uraditi ali imaću jedan veoma zeznut posao oko implementacije kontakt forme u php u html e tu pucam samo tako,btw hvala na kodu i na pomoći.

holodoc · 2.12.2008, 23:01

Citat:

Raub kaže:

Sve u svemu hvala ti holodoc,idem da se obrazujem i mislim da ću nešto uraditi ali imaću jedan veoma zeznut posao oko implementacije kontakt forme u php u html e tu pucam samo tako,btw hvala na kodu i na pomoći.

Tema o kontakt formama na ovom forumu imaš kolko oćeš

Naći će se već neka za tebe

A ako zapneš negde sa CSS-om postavi slobodno pitanje ovde ali daj i kod sa objašnjenjem onoga što ne valja. I stavi kod između [сode] i [/сode] tagova

Raub · 3.12.2008, 16:37

...evo mog prvog css pa te molim da vidiš i da mi ukažeš gde grešim
u css bilo koji parametar da se promeni search box ne reaguje gde je caka da konačno postavim taj box gde hoću.
evo:
mojstil.css

Kod:

@charset "utf-8";
/* CSS Document */
cse-search-box {
    position: fixed;
    left: 300px;
    top: 10px;
    padding: 10px;
    border: 1px #000000 solid;
    float: inherit;
}

evo html

Kod:

<!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 href="mojstil.css" rel="stylesheet" type="text/css" />
<style type="text/css">
<!--


#apDiv1 {
    position: fixed;
    width: auto;
    height: auto;
    z-index: 1;
    top: auto;
    left: auto;
    display: inline;
    float: left;
  padding: 2px;
  padding-left: 1px;
  padding-right: 0px;
  margin: 0;
  margin-left: -1px
}
#apDiv2 {
    position:absolute;
    width:226px;
    height:59px;
    z-index:1;
    left: 757px;
    top: 221px;
}
#apDiv3 {
    position:absolute;
    width:202px;
    height:31px;
    z-index:1;
    left: 784px;
    top: 223px;
    float: right;
}

-->
</style>
</head>

<body text="#333333" link="#993300" vlink="#993300" alink="#993300">
<div align=center>
<table width="800" border="0" align="center">
<tr>
<td><img src="images/layout_01.gif" width="303" height="152" /><img src="images/layout_02.gif" width="211" height="152" /><img src="images/layout_03.gif" width="269" height="152" /></td>
</tr>
</table>
</div>
<div align=center>
<table width="806" border="0" align="center">
<tr>
<td><img src="images/glavnimenu.gif" width="798" height="36" /></td>
</tr>
</table>
<div align=center><table width="800" border="1" align="center" cellpadding="20">
<tr>
<td width="551" height="800" align="center">&nbsp;</td>
<td width="233" height="800"><div id="apDiv3"><form action="http://www.zanat.rs/Pages/Google.html" id="cse-search-box">
  <div>
    <input type="hidden" name="cx" value="014174298231988165728:4ncz52dfq38" />
    <input type="hidden" name="cof" value="FORID:10" />
    <input type="hidden" name="ie" value="UTF-8" />
    <input type="text" name="q" size="15" />
    <input type="submit" name="sa" value="Traži" />
  </div>
</form></div>
<div id="apDiv1"></div>
</table>
<div align=center><table width="800" border="1">
<tr>
<td width="552" height="100"><img src="images/footer552.gif" width="552" height="100" /></td>
<td width="232"><img src="images/footer232.gif" width="232" height="100" /></td>
</tr>
</table>
</div>
</div>
</div>
</body>
</html>

PDarko · 4.12.2008, 2:38

Прво, треба да раздвојиш садржај и форматирање. Дакле, за форматирање се користи CSS.
Ствари као што су:

HTML kod:

<body text="#333333" link="#993300" vlink="#993300" alink="#993300"></body>

треба да изгледају овако:

HTML kod:

<body></body>

Kod:

body {
    color: #333333;
}
a, a:visited, a:active {
    color: #993300;
}

Друго, ако си већ ставио део стилова у екстерни фајл онда их стави све. Дакле, следећи код пребаци у екстерни фајл (mojstil.css)

Kod:

#apDiv1 {
position: fixed;
width: auto;
height: auto;
z-index: 1;
top: auto;
left: auto;
display: inline;
float: left;
padding: 2px;
padding-left: 1px;
padding-right: 0px;
/*предходна три реда могу да се замене са padding: 2px 0 2px 1px; */
margin: 0;
margin-left: -1px
}
#apDiv2 {
position:absolute;
width:226px;
height:59px;
z-index:1;
left: 757px;
top: 221px;
}
#apDiv3 {
position:absolute;
width:202px;
height:31px;
z-index:1;
left: 784px;
top: 223px;
float: right;
}

Треће, ID селектор мора да почиње са #, а CLASS са .. Нпр:

HTML kod:

<div id="moj_id"></div>
<div class="moja_klasa"></div>

#moj_id { ... }
.moja_klasa { ... }

Четврто, <form ...> елемент мора да садржи атрибуте action и method.

HTML kod:

<form action="moja_strana.php" method="post"> ... <form>

А, сад грешке.

Kod:

#cse-search-box {
position: fixed;
left: 300px;
top: 10px;
padding: 10px;
border: 1px #000000 solid;
float: inherit;
}

Црвено су грешке, а плаво код који се подразумева или није неопходан.

holodoc · 4.12.2008, 2:46

Ne stižem da odgovorim zbog posla ali kako čovek da se ne napravi pametan posle ovako lepog uvoda...

Dodao bih samo još jednu stvar... (za sada

) Zaboravi fixed pozicioniranje. Ne podržavaju ga svi browseri kako treba a i realno gledano će ti u veoma malo slučajeva biti potrebno.

BTW, rekoh li ti ja da stavljaš kod u CODE tagove?

2.12.2008, 18:49	#1
Raub Član Član od: 18.1.2006. Poruke: 76 Zahvalnice: 6 Zahvaljeno jedanput na jednoj poruci	DW - kako sa ćelijom Ljudi,molim vas kako da rešim problem sa ćelijom.Želim da ubacim konkretno kod za google serach,sce to lepo odradim ali mi se search ne nalazi unutar već van ćelije,i to nije slučaj samo sa kodom već i kad' ubacim flash animaciju sve to meni izlazi van okvira ćelije.Pomozite ako boga znate.

2.12.2008, 20:55	#2
holodoc Deo inventara foruma Član od: 5.12.2005. Poruke: 6.785 Zahvalnice: 348 Zahvaljeno 1.893 puta na 1.078 poruka	Re: DW Kako sa ćelijom "Daj malo koda sestro..."

2.12.2008, 22:02	#5
Raub Član Član od: 18.1.2006. Poruke: 76 Zahvalnice: 6 Zahvaljeno jedanput na jednoj poruci	Re: DW Kako sa ćelijom Ok, znači sve objekte koje budem unosio da ih unosim malo levo kako bi sve bilo dobro.oprosti mi molim te ali ako se sada ne naučim nikada neću izrada ovog sajta mi je pitanje života,ne zezam se, da imam kintu ne bih vas ovde smarao.

2.12.2008, 22:27	#7
Raub Član Član od: 18.1.2006. Poruke: 76 Zahvalnice: 6 Zahvaljeno jedanput na jednoj poruci	Re: DW Kako sa ćelijom ...znači CSS mi je rešenje a jedno od toga je i float css,jel tako

4.12.2008, 2:38	#12
PDarko Veteran Član od: 11.7.2006. Lokacija: /dev/random Poruke: 1.011 Zahvalnice: 163 Zahvaljeno 182 puta na 147 poruka	Re: DW Kako sa ćelijom Прво, треба да раздвојиш садржај и форматирање. Дакле, за форматирање се користи CSS. Ствари као што су: HTML kod: <body text="#333333" link="#993300" vlink="#993300" alink="#993300"></body> треба да изгледају овако: HTML kod: <body></body> Kod: body { color: #333333; } a, a:visited, a:active { color: #993300; } Друго, ако си већ ставио део стилова у екстерни фајл онда их стави све. Дакле, следећи код пребаци у екстерни фајл (mojstil.css) Kod: #apDiv1 { position: fixed; width: auto; height: auto; z-index: 1; top: auto; left: auto; display: inline; float: left; padding: 2px; padding-left: 1px; padding-right: 0px; /предходна три реда могу да се замене са padding: 2px 0 2px 1px; / margin: 0; margin-left: -1px } #apDiv2 { position:absolute; width:226px; height:59px; z-index:1; left: 757px; top: 221px; } #apDiv3 { position:absolute; width:202px; height:31px; z-index:1; left: 784px; top: 223px; float: right; } Треће, ID селектор мора да почиње са #, а CLASS са .. Нпр: HTML kod: <div id="moj_id"></div> <div class="moja_klasa"></div> #moj_id { ... } .moja_klasa { ... } Четврто, <form ...> елемент мора да садржи атрибуте action и method. HTML kod: <form action="moja_strana.php" method="post"> ... <form> А, сад грешке. Kod: #cse-search-box { position: fixed; left: 300px; top: 10px; padding: 10px; border: 1px #000000 solid; float: inherit; } Црвено су грешке, а плаво код који се подразумева или није неопходан.

Sledećih 2 korisnika se zahvaljuje korisniku holodoc na korisnoj poruci:
Jenkiduduldu (13.12.2008), PDarko (2.12.2008)

2.12.2008, 22:59	#9
Raub Član Član od: 18.1.2006. Poruke: 76 Zahvalnice: 6 Zahvaljeno jedanput na jednoj poruci	Re: DW Kako sa ćelijom Sve u svemu hvala ti holodoc,idem da se obrazujem i mislim da ću nešto uraditi ali imaću jedan veoma zeznut posao oko implementacije kontakt forme u php u html e tu pucam samo tako,btw hvala na kodu i na pomoći.

4.12.2008, 2:46	#13
holodoc Deo inventara foruma Član od: 5.12.2005. Poruke: 6.785 Zahvalnice: 348 Zahvaljeno 1.893 puta na 1.078 poruka	Re: DW Kako sa ćelijom Ne stižem da odgovorim zbog posla ali kako čovek da se ne napravi pametan posle ovako lepog uvoda... Dodao bih samo još jednu stvar... (za sada ) Zaboravi fixed pozicioniranje. Ne podržavaju ga svi browseri kako treba a i realno gledano će ti u veoma malo slučajeva biti potrebno. BTW, rekoh li ti ja da stavljaš kod u CODE tagove?

Slične teme
tema	temu započeo	forum	Odgovora	Poslednja poruka
Kako skinuti klip sa kobajagrande.com ?	NemesisTT	Brbljaonica	2	11.6.2008 12:59
Kako povezati 5.1 zvučnike sa kompjuterom?	dile	Foto i audio/video	3	24.2.2008 12:53
Kako ohladiti Gigabyte 8800gt sa stock coolerom	Mali Robot	Grafika	5	22.2.2008 18:34