CODEWITHSUNDEEP
htmlcss
Wanting to learn
Wanting to learn

Reputation: 468

getting text to push up or down depending on what text is below it

If I have a series of text in a top to bottom list like, actor, title, about...

about can be massive or small. If cast is below about how can I always keep cast just below about no matter how much text is in cast?

JSFIDDLE

#detail_center{position: absolute; height: 615px;left: 369px;top: 155px;width: 751px;}

#detail_center .title{position: absolute; top: 84px; left: 266px; font-size: 26px; color: black;}
#detail_center .runtime{position: absolute; top: 130px; left: 266px; font-size: 16px; color: black;}
#detail_center .icon-detail-bar{}
#detail_center .rating{position: absolute; top: 130px; left: 340px; font-size: 16px; color: black;}
#detail_center .synopsis{position: absolute; top: 160px; left: 266px; font-size: 16px; color: black;}
#detail_center .cast{position: absolute; top: 220px; left: 266px; font-size: 16px; color: black;}
#detail_center .lang{position: absolute; top: 290px; left: 266px; font-size: 16px; color: black;}

HTML

  <div id="detail_center">
   <div class="title">Some awesome movie title</div>
   <div class="runtime">116 mins  |</div>
   <div class="rating">PG-13</div>
   <div class="synopsis"> about stuff and stuff stuff and stufff and stuff stuff and stutuff and stuff stuff and stuff stuff and stuff stuff and stuff stuff and stuff</div>
   <div class="cast">CAST:</div>
   <div class="lang">LANGUAGES:</div>
  </div>

Upvotes: 1

Views: 91

Answers (1)

chopper
chopper

Reputation: 6709

Take out position:absolute from the CSS of the child elements. See this working jsFiddle

Upvotes: 2

Related Questions