Странен проблем с дизайна..

[justspy]

Значи кодирам си един дизайн .. всичко добре като за начало.. кодирам котойките на 3 части ..

1-Горна част
2-Текстова част (където ще е информацията)
3-Долна част

И така проблема е, че две различни котойки се влиаят една от друга тоест .. когато текста в кутийка (1) беше сравнително малко всички си беше добре но когато сложих по голям текст защото там ще има категорий котийка (2) падна надоло ето ви снимка http://store.picbg.net/pubpic/C3/3F/6ea1e770a2aec33f.JPG
по картинката може да видите, че дясната котийка тоест падналата се влияе от тази от ляво с категорийте ето кода на 2-те котийки, 3-те им части :


Котийката с категориите

#catsup {
background-image: url(imgs/catsup.gif);
width: 213px;
height: 51px;
margin-top: -170px;
margin-left: 35px;
}

#catscenter {
background-image: url(imgs/catscenter.gif);
background-repeat: repeat-y;
width: 197px;
*width: 208px;
height: auto;
margin-left: 34px;
text-align: center;
padding-left: 12px;
  top: 0;
  right: 0;
  bottom: 0;
  left: 0;
}


#catsdown {
background-image: url(imgs/catsdown.gif);
width: 213px;
height: 100px;
margin-left: 34px;
}

Котийката която се влияе -

#controlpanelup {
background-image: url(imgs/controlpanelup.gif);
width: 213px;
height: 51px;
margin-top: -242px;
margin-left: 950px;
}

#controlpanelcenter {
background-image: url(imgs/controlpanelcenter.gif);
background-repeat: repeat-y;
width: 197px;
*width: 208px;
height: auto;
margin-left: 951px;
text-align: center;
padding-left: 12px;
  top: 0;
  right: 0;
  bottom: 0;
  left: 0;
}

#controlpaneldown {
background-image: url(imgs/controlpaneldown.gif);
width: 213px;
height: 100px;
margin-left: 951px;
}

 

[gLaVoReZa]

Задай на тази дясната кутийка следното.

position : absolute;

Пиши след това дали се е оправило.

 

[justspy]

Ами не .. удължи се много.. стана на нищо

 

[GaTio2]

сложи след

</div>

на дясната кутийка

<div style="clear: both;"></div>

или пробвай накрая