ugrás a tartalomhoz

Dobozok formázása CSS-sel

Anonymous · 2005. Aug. 1. (H), 11.42
Sziasztok! A következőre keresem a megoldást:

Van 2 dobozom. Az egyik a baloldalra (float:left;) a másik a jobboldalra (float:right;) van igazítva. Azt szeretném elérni, hogy amikor a bal oldali dobozt feltöltöm tartalommal, akkor a jobb oldali doboz automatikusan vegye fel a tartalommal feltöltött doboz méretét (magasságát).

Pontosan úgy, mintha egy kétoszlopos táblázatról beszélnénk. Amikor a táblázat baloldalába beírok mondjuk 10 sort, akkor a táblázat jobb oldali cellája is felveszi a 10 sor magasságot. Ez lenne a kérdés. Valami jópofa megoldásnak nagyon örülnék. Előre is köszike. ((Zatya))
Ja és itt van a kérdés példája:

A CSS:

.baldoboz
{
background-color: yellow;
width: 200px;
float:left;
}

.jobbdoboz
{
background-color: blue;
width: 200px;
float:right;
}

ÉS A HTML

<body>

<div>

<div class="baldoboz">
<p>Azt szeretn&eacute;m el&eacute;rni, hogy a jobb oldalon l&aacute;that&oacute; k&eacute;k boboz, ugyanezt a m&eacute;retet vegye fel, (mint ez a s&aacute;rga doboz).</p>
</div>

<div class="jobbdoboz">Jobb oldali k&eacute;k doboz. </div>

</div>

</body>
‹ Eseménykezelés CSS-ben Rövid webcímek használata (mint a Weblaboron) ›
 ■
1

:-(

kgyt · 2005. Aug. 1. (H), 11.58
Sajnálattal láttam, hogy a következőket nem vetted figyelembe:
  • Archívum
  • BBcode szinezés használata
  • Google

Adj a tartalmazó divnek olyan hátteret, ami mindkettő doboznak háttér lesz.
A tartalmazó doboz aljára tegyél egy clear:both tulajdonságú bármit.


--
Szeretettel: Károly György Tamás
kgyt(a)kgyt.hu - http://kgyt.hu
2

Ne sajnálkozz kérlek,

zatya · 2005. Aug. 1. (H), 12.44
Ne sajnálkozz kérlek, inkább adj érthető választ az érthető kérdésemre. A google-nek nem tudom mi köze van a témához. Az archivumot egyébként nem találom sehol sem. Na mindegy remélem azért valaki rávezet a megoldásra. Köszi!
3

Olvasás...

kgyt · 2005. Aug. 1. (H), 12.50
A sajnálkozás után megadtam a választ érthetően.
Ha nem érted, akkor nem velem van bajod, hanem az alapokkal...

--
Szeretettel: Károly György Tamás
kgyt(a)kgyt.hu - http://kgyt.hu
4

Ok. Csináltam gyorsan egy

zatya · 2005. Aug. 1. (H), 13.04
Ok. Csináltam gyorsan egy hátteret, amit megadtam háttérnek mindkét doboznak, majd megadtam a clear:both; paramétert mindkét doboznak, aztán külön-külön is, de nem történt semmi olyasmi ami megoldás lenne a kérdésemre. A háttérnek egyébként nem tudom mi köze van a doboz magasságához.

Nem fix magasságot szeretnék hanem azt, hogyha a bal oldali dobozba beírok 10 sor magas szöveget, akkor a JOBB OLDALI DOBOZ IS FELVEGYE A 10 SOR MAGASSÁGOT, függetlenül attól, hogy nem tartalmaz semmit sem (sem szöveget, sem hátteret, sem képet, sem flash klippet).

Itt van a javaslatod:

.baldoboz {
background-color: yellow;
width: 200px;
float:left;
background-image: url(file:///D|/_Oldalak/gyakorlo%20oldalak/dodbozolas1/hatter.jpg);
/*clear:both;*/
}
.jobbdoboz {
background-color: blue;
width: 200px;
float:right;
background-image: url(file:///D|/_Oldalak/gyakorlo%20oldalak/dodbozolas1/hatter.jpg);
clear:both;
}
6

A háttér az egy további

Ajnasz · 2005. Aug. 1. (H), 13.11
A háttér az egy további dobozt jelent, amibe el kell helyezned a két floatolt dobozt. Továbbá ugyanebbe a dobozba, a floatoltak alá tegyél mégegy dobozt, aminek add meg a clear:both; tulajdonságot.

<szerk>Lehet, hogy nem érdemled meg a segítséget?</szerk>
7

Alapvető szövegértés

kgyt · 2005. Aug. 1. (H), 13.16
Nem értetted meg a szöveget, pedig magyarul írtam...

.tartalmazo {
  background: red url(mindketto.png) repeat-y left top;
}
.baldoboz {
  background-color: yellow;
  width: 200px;
  float: left;
}
.jobbdoboz {
  background-color: blue;
  width: 200px;
  float: right;
}
.lezaro {
  height: 0;
  clear: both;
}


<!DOCTYPE ...>
<html>
<head ...>
<body>
  <div class="tartalmazo">
    <p class="baldoboz">Azt szeretném elérni,
       hogy a jobb oldalon látható kék boboz,
       ugyanezt a méretet vegye fel,
       (mint ez a sárga doboz).</p>
    <p class="jobbdoboz">Jobb oldali kék doboz.</p>
    <p class="lezaro"></p>
  </div>
</body>
</html>
Látod, így színezve jobban olvasható. Olyan nehéz lenne neked is alkalmazni a színezést?

--
Szeretettel: Károly György Tamás
kgyt(a)kgyt.hu - http://kgyt.hu
5

gondolkodj, kérlek

kmm · 2005. Aug. 1. (H), 13.05
Ne követelőzz, kérlek!
Inkább olvasd el mégegyszer a kapott választ, azután aszerint járj el.

--
üdv: kmm... ( http://kmm.hu )
8

<Nincs cím>

noocx · 2005. Aug. 1. (H), 19.06
Hejho!

http://webhost.bridgew.edu/etribou/layouts/skidoo/

</noocx>