ugrás a tartalomhoz

Nem egymás mellett jelenik meg a két divem

Anonymous · 2006. Ápr. 19. (Sze), 21.07
Tudom lerágott csont, de nem tudom mi a baja. Itt a kód:
  1. div.container { width: 678px; }  
  2. div.maincontainer { float: right; width: 489px; }  
  3. div.mainheader { width: 483px; background-image: url(tile.png); font-size: 10px; color: #FFFFFF; border: black 1px solid; text-align: left; font-weight: bold; padding-top: 2px; padding-left: 2px; padding-right: 2px; vertical-align: middle; height: 16px; }  
  4. div.maincontent { width: 483px; background-color: #F6F5F5; padding: 2px; border-left: black 1px solid; border-right: black 1px solid; border-bottom: black 1px solid; }  
  5. div.sidecontainer {  float: left; width: 179px; }  
  6. div.sideheader { margin-right: 10px; float: left; width: 173px; background-image: url(tile.png); font-size: 10px; color: #FFFFFF; border: black 1px solid; text-align: center; font-weight: bold; padding-top: 2px; padding-left: 2px; padding-right: 2px; vertical-align: middle; height: 16px; }  
  7. div.sidecontent { width: 173px; background-color: #F6F5F5; border-bottom: black 1px solid; border-left: black 1px solid; border-right: black 1px solid; padding: 2px; text-align: left; }  
a html pedig
  1. <div class="container">  
  2.          <div class="sidecontainer">  
  3.              <div class="sideheader"></div>  
  4.              <div class="sidecontent"></div>  
  5.     </div>  
  6.     <div class="maincontainer">  
  7.         <div class="mainheader"></div>  
  8.         <div class="maincontent"></div>  
  9.     </div>  
  10. </div>  
Hallottam hogy valahova clear: both; -t kell beszúrni. Az mire jó, hova kellene beszúrnom?
‹ Táblázatom szétcsúszik, ha több a tartalom benne CSS: menü készítése ›
 ■
1

hopp

Anonymous · 2006. Ápr. 19. (Sze), 21.08
hopp lemaradt a lényeg, a kód ezt produkálja: http://img484.imageshack.us/img484/3889/hibaacss9zn.jpg
3

melyik kód?

balazsgabi · 2006. Ápr. 19. (Sze), 23.19
mert a fenti sztem rendben van, amennyiben a két container felső részét egymás mellett szeretnéd elhelyezni. A hibaacss9zn.jpg kép úgy keletkezhetett, hogy a sidecontainer-t nem kielégítően lebegtetted.
5

.

Anonymous · 2006. Ápr. 20. (Cs), 06.49
és hogy is lehet ezt megoldani? köszi
2

HTML hiba?

janoszen · 2006. Ápr. 19. (Sze), 21.53
Mi lenne, ha először levalidálnád a kódot és utána keresnél CSS hibákat? :D A feltett kódodban ugyanis hiányzik egy div...
4

.

Anonymous · 2006. Ápr. 20. (Cs), 06.48
hol hiányzik div? szerintem nincs a cssben olyan hiba ami ezt eredményezné, hogy egymás mellé rakja.
6

Helytelen szélesség

Török Gábor · 2006. Ápr. 20. (Cs), 10.34
  1. div.sidecontainer {  float: left; width: 179px; }  
  2. div.sideheader { margin-right: 10px; float: left; width: 173px; [...] }  
A szülő 179 px széles, az egyik bennfoglaló elem viszont 173 px (width) + 10 px (leftmargin) = 183 px helyet követel magának. Szegénnyel jól kiszúrtál.
7

nem a szélesség

balazsgabi · 2006. Ápr. 20. (Cs), 23.47
továbbra is fenntartom, hogy a sidecontainer vagy nem float-olt, vagy a szélessége nagyobb mint 173px. (a linkelt kép alapján)
A sideheader jobb margója bármekkora lehetne amig balra lebeg.

Ha a témaindító belinkelné a kép forrását, akkor sztem kiderülne, hogy az nem egyezik a fenti kóddal.
gábor
8

ok

Anonymous · 2006. Ápr. 21. (P), 12.09
ok köszönöm, így márjó, margint ki kellet vennem. Amúgy mi van abban az esetben, ha 3 ilyen divet akarok egymás mellé rakni? Úgy értem hogy három doboz egymás mellett.
9

attól függ

balazsgabi · 2006. Ápr. 21. (P), 13.38
Lehet ez is egy megoldás, de a konkrét elképzelés esetében könnyebb válaszolni.

Egyébként most már tényleg kíváncsi vagyok, hogy a sideheader margóját vetted ki, és ez oldotta meg a problémádat?
gábor
10

.

Anonymous · 2006. Ápr. 21. (P), 14.01
igen, kivettem a margint és jó
11

elképzelés

Anonymous · 2006. Ápr. 21. (P), 14.04
Egy ilyet szeretnék összedobni http://img215.imageshack.us/img215/7476/ilyete7hz.jpg
12

én meg...

Anonymous · 2006. Ápr. 21. (P), 14.10
én pedig jó időt szeretnék.

gex
13

jó idő

Anonymous · 2006. Ápr. 21. (P), 14.16
Akkor inkább látogass el az országos meteorológiai szolgálat weblapjára és ott reklamálj, de ide ne írj hülyeségeket. Ez nem a játszótér.
14

:]

Anonymous · 2006. Ápr. 21. (P), 14.26
nem is a vágyaid közlésére szolgáló fórum.

gex
19

..

Anonymous · 2006. Ápr. 21. (P), 16.37
Megkérdezte tőlem mit szeretnék én megmutattam. Ne szolalj már meg légyszives. köszönjük.
15

Időjárásban nem, de kódban esetleg tudok segíteni ;)

beef · 2006. Ápr. 21. (P), 14.45
Itt a CSS :
  1. .bal {  
  2.     width: 110px;  
  3.     height: 50px;  
  4.     background-color: Black;  
  5.     float: left;  
  6. }  
  7.   
  8. .kozep {  
  9.     height: 50px;  
  10.     background-color: Red;  
  11. }  
  12.   
  13. .jobb {  
  14.     width: 110px;  
  15.     height: 50px;  
  16.     background-color: Green;  
  17.     float: right;  
  18. }  
  19.   
  20. .keret {  
  21. }  
  22.   
  23. .fejlec {  
  24.     height: 10px;  
  25.     background-color: Olive;  
  26. }  
Ez a HTML :
  1. <div class="keret">  
  2. <div class="fejlec"></div>  
  3.   
  4. <div class="bal"></div>  
  5. <div class="jobb"></div>  
  6. <div class="kozep"></div>  
  7.   
  8. </div>  
Remélem segít, van még rajta mit csiszolgatni, de kiindulásnak jó.
17

Egymasba agyazott lista

Jano · 2006. Ápr. 21. (P), 15.56
Én egymasba agyazott listakat hasznalnek. A friss_cuccok listaja: felso szint: progik, cikkek, topikok, belso listak ezek eleme.

Altalaban igaz az, hogy nem jo a kinezet alapjan elnevezni a strukturalis elemekt: mint pl keret vagy jobb és bal.

A megoldasodban egyebkent ha nem a kozepso a leghosszabb akkor a jobb vagy bal oszlop kiloghat a keretbol a floatolas miatt!

Megj: ha 3 oszlopot kell egymas melle tenni akkor nem kell a baloldalit balra, a jobboldalit jobbra floatolni, altalaban egyszerubb ha mind a 3 oszlop balra van floatolva. Igy a kodbeli sorrend megegyezik a megjeleno sorrenddel is.
20

köszi

Anonymous · 2006. Ápr. 21. (P), 16.38
Köszönöm.
16

ne hagyjatok hüllén meghalni

balazsgabi · 2006. Ápr. 21. (P), 15.18
ha egy elemet float-olok jobbra, akkor a bal margója "mintha ott se lenne", illetve a másik irányba fordítva.
Vagy ez csak nálam jelentkezik?
gábor
18

Nalad lesz a hiba.

Jano · 2006. Ápr. 21. (P), 16.08
Egy tipikus elofordulas: szovegben "korbefolyatott" kép. Egyik oldalra van igazitva (floatolva) es a masik oldalan van margo, hogy a szoveg ne tapadjon ra.
21

és igen

balazsgabi · 2006. Ápr. 21. (P), 22.45
velem volt a hiba, szigorúan a fenti kódra koncentráltam. Amint "körülfolyattam" már látszott is a margin. Köszönöm!
gábor