Настройка HTML таблицы содержания отображается

Question

работает над этим и не могу показаться, чтобы выяснить это:

нужно HTML таблицу для хранения содержимого страницы в WordPress. Например,

<table class="tableContent"> 
    <td> 
    <div id="columnOne"> 
     <h1> 
     <div id="pageTitle"><?php echo get_the_title($ID); ?> </div> 
     <img src="<?php bloginfo('template_url');?>/...img.png"> 
     </h1> 
     <?php if (have_posts()) : while(have_posts()) : the_post(); 
       the_content(); 
      endwhile; endif; ?> 
    </div> 
    </td> 
    </table> 

стиль для этого

.tableContent{ 
    position: relative; 
    width: 60%; 
    background-color: #FFFFFF; 
} 

Проблема заключается в том, что таблица оленья кожа приспособиться к высоте the_content (содержание в WordPress страницы)

Таким образом, если пользователь имеет одну страницу с текстом на половину страницы, тогда как у пользователя также есть другая страница с полной страницей текста, таблица не будет настраиваться на высоту обеих страниц.

Чтобы повторить, я создаю белую область содержимого, которая будет отображаться как фон за текстом страницы. Эта область содержимого должна иметь возможность настраивать высоту динамического текста на странице. Должен ли я использовать таблицу или есть лучшая практика в этом случае?

Спасибо за помощь.

Answer 1

Трудно точно сказать, что вы ищете из вашего описания, но вот моя интерпретация этого:

http://jsfiddle.net/J89K5/1/

HTML:

<div class="wrapper"> 
    <h1>Page Title</h1> 
    <div class="content"> 
     <article> 
      <header> 
       <h2>Post Title</h2> 
       <img src="http://dummyimage.com/600x200/bada55/fff.png" alt="Post Header Image"> 
      </header> 
      <p>Lorem ipsum dolor sit amet, consectetur adipisicing elit. Suscipit porro vero facilis aspernatur nesciunt repellat dicta explicabo a quod praesentium dolorem quasi magnam accusamus debitis veniam veritatis quas odit ipsam.</p> 
      <p>Lorem ipsum dolor sit amet, consectetur adipisicing elit. Explicabo maxime dolorum dolorem debitis ipsum ut tempora voluptates tenetur fuga esse dicta eos magnam sunt iure adipisci consectetur voluptate laborum nulla.</p> 
      <p>Lorem ipsum dolor sit amet, consectetur adipisicing elit. Necessitatibus minus adipisci excepturi nemo distinctio ut harum quae eligendi cupiditate laudantium consectetur unde tenetur omnis quidem itaque veritatis neque. Consequatur iste!</p> 
     </article> 
    </div> 
</div> 

CSS:

.content { 
    width: 60%; 
    padding: 1em; 
    background: #fff; 
} 

Как отметил @misterManSam, вы не должны использовать для макета страницы. Тем не менее, ячейка таблицы будет соответствовать ее высоте ее содержимому. Поэтому я не уверен, что происходит здесь. Просто из кода, который вы указали, вы не должны получать такое поведение. Возможно, ваша обертка содержимого плавающая, абсолютная или фиксированная?