DIV

Zkusím to, ale na tom příkladu d2 to nefunguje, aby ty kolonky byli vedle sebe... A nevím zda to půjde.

Dneska to nenakopíruju na web, ale mrkni na tohle:

<style type="text/css">
fieldset.unify {margin:5;padding:5;background-color:#DDDDDD;}
P.little { margin:10;padding:10; width=350; background-color:#EEEEEE;border: solid 1;border-color:#AAAAAA;}
P.little_left { margin:10;padding:10; width=350; float:left;background-color:#EEEEEE;EEEEEE;border: solid 1;border-color:#AAAAAA;}
P.other { margin:10;padding:10; background-color:#EEEEEE;border: solid 1;border-color:#AAAAAA;}
fieldset.submit { margin:10;padding:10; text-align : center;}
DIV.td_element {float:left;}
DIV.td_desc {font-style:italic;font-size:13;font-family : "Times New Roman", Times, serif;}
label {font-style:italic;font-size:13;font-family : "Times New Roman", Times, serif;}
label.heading {font-size:14;font-weight:bold;font-style:normal;color:#444444;font-fa mily: Arial, Helvetica, sans-serif;}
legend { background-color:#7070A2;color:white;font-size:12;font-weight:bold;f ont-family: Arial, Helvetica, sans-serif;}
EM { font-size:12; }
P.{ margin-left: 10px; font-style:italic;font-size:13;font-family : "Times New Roman", Times, serif;}
</style>

<form>
<fieldset id=myform class=unify>
<label for="myform" class="heading">Vytvoření článku</label>

<p class="form">Vyplňte prosím tento formulář.</p>

<DIV style="float:inline">
<P id="title" class=little_left>
<label for="title" class=td_title>Nadpis:</label>
<input type="text" id="nadpis" name="nadpis" size="30" >
<EM>Popisek... Když bude kolonka "Nadpis" uvedena na jednom řádku s kolonkou "Popisek" Rozměr popisku zde se zmenší a proto se popisek nevejde vedle INPUT name="nadpis".</EM><br>
</P>


<P id="desc" class=little>
<label for="desc" class=td_title>Popisek</label>
<input type="text" id="matka_jmeno" name="matka_jmeno" size="30">
<EM>Popisek... Proto jsem uváděl každou část kolonky (1. title 2. INPUT 3. desc.) do DIV, aby popisek neskočil na řádek pod INPUT ale zůstal vedle něj. </EM><br>
</P>
</DIV>


<P id="keywords" class=other>
<label for="keywords" class=td_title>Klíčová slova:</label>
<INPUT class=input type="TEXT" name="keywords" size=75 maxlength="70" >
<EM>Druhým problémem zůstává fakt, že když kolonky uzavřu tagem P, nelze tyto dvě kolonky dát na jeden řádek.</EM><br>
</P>


<P class=submit>
<p><input type="submit" value="Odeslat" ></p>
</P>

</fieldset>

</form>

Když si to prohlídneš v prohlížeči, uvidíš, že popisek není na svém místě a to nemluvím o kolonkách nadpis a popisek, které mají být na jendom řádku. Proto jsem používal DIV místo P. Znáž způsob jak to vyřešit? Jsem ochoten dát tam místo DIV SPAN, ale stále to znamená, že title, nadpis a desc. musí být zvlášť vnořené...

Jokere,
hodli jsem to na net:

http://pravatvar.wz.cz/div_problem.htm

Jokere,
čteš to?

Díky Jokere,
za pomoc i za čas. Mrknu a odpovím.

Ahoj.
No mohl bych jít to řešit do sekce o stylech, jenže to bych musel zas všechno vysvětlovat znova... a snad už to nějak dořešíme, ne?

Myslím, že ti rozumím, co chceš říct, jenže stejně se mi nevede dosáhnout kýženého cíle. Používám display:inline, ale nefunguje. Zkoušel jsem místo P dát SPAN. Takže nevím jak potlačit do odřádkování mezi kolonkami. A to je jen jedna polovina problému.
Ten druhý problém se týká umístění popisku.

* * *
Tak to float_inline byl omyl, mělo tam být display.

(Toto je odpověď na vaše otázky “ Proč ten odstavec děláte plovoucí?“.) Já chci aby kolonka pro Nadpis (článku) a kolonka pro Popisek (článku) byly na jednom řádku. Když vnoříme toto:
<label>.. . <input> … <EM> …
do:
<P></P>
tak obě kolonky jsou na každém řádku zvlášť. A ať se na to dívám v Opeře, Mozille nebo IE tak problém není vyřešen.

S tím <P></P> se význam tříd class=little_left a class=little ztrácí. Ta první třída má první kolonku stáhnout na menší šířku a nastavit float doleva, tak aby se ta druhá kolonka (třída little) taky zmenšíla na menší šířku. Rozdíl je jen v tom, že ta kolonka vlevo má float, jinak ty třídy znamenají jen to nastavení menší šířky kolonkám. Já vím, že je to udělané divně, ale neumím to zjednodušit :-(

Mělo by to vypadat:

"syntaxe":
(Nadpis článku: <INPUT> vložte popisek) (Popisek článku: <INPUT> vložte popisek)

Nikoliv akto:
(Nadpis článku: <INPUT> vložte
popisek)
(Popisek článku: <INPUT> vložte
popisek)

PŘESNĚ TAKHLE:

http://pravatvar.wz.cz/d.htm

Používám IE, ale myslím, že to vypadalo stejně i v Moziile

To Joker.
Plovoucí prvek - tedy float. Ale použil jsem tam display:inline. Myslím že jsem to zkoušel i se SPANem.

http://pravatvar.wz.cz/obrazek.gif

http://pravatvar.wz.cz/hotovo.htm

Měl jsem blbe třídu, proto mi to nejelo.

No jo, ted se na to dívám. Poznámka ok, ale zase to inline...

V opeře a IE se to zobrazuje správně, ale mozzila dělá problém s tím inline-block jak kdyby to tam nebylo. Nevíš proč?

A dělalo ti to stejnou chybu jako mě?