Question

我试图让css表中的内容响应，我没有运气。有问题的页面位于：http://www.outtacontext.com/wp2/about/jeffs-past-so-many-dopplegangers/

它由三个单元格组成（使用css样式，如“display：table;”等）。第一个和第三个是图像，中间是文本。

以下是代码：

<div id="table">
<div class="row2">
<div class="cellleft"><a class="nounderline" href="http://outtacontext.com/wp2/past8"><img alt="Dance Lesson illustration" src="http://outtacontext.com/wp2/wp-content/themes/sentence/images/past/past7a.jpg" border="0" /></a></div>
<div class="cellmiddle">

I majored in Political Science and my first roommate's name was Rick Gates. He was from <a title="DeTour Village" href="https://maps.google.com/maps?q=DeTour+Village,+Michigan&amp;hl=en&amp;ll=45.984558,-83.873062&amp;spn=0.157687,0.382118&amp;sll=38.899672,-77.024424&amp;sspn=0.022077,0.047765&amp;hq=DeTour&amp;hnear=Michigan,+Nelson,+North+Dakota&amp;t=m&amp;z=13">DeTour Village</a>, Michigan (on the tip of the Upper Peninsula). Back then, the golf course on nearby Drummond Island doubled as the airport.

Rick was tall and lanky and I was, well, not. Yet, no one in our dorm could tell us apart. Everyone called me Rick. This was my first identity crisis. Little did I know my name and looks would lead me to others...

</div>
<div class="cellright"><a class="nounderline" href="http://outtacontext.com/wp2/past8"><img alt="Dance Lesson illustration" src="http://outtacontext.com/wp2/wp-content/themes/sentence/images/past/past7b.jpg" border="0" /></a></div>
</div>
</div>

这是CSS：

.page-template-template-jeffpast-php div#table {display: table; height: 40%; width: 43em; margin: .9em 0; background-color: #000; display: block; }
.page-template-template-jeffpast-php div.row2 {display: table-row; ; display: block; }
.page-template-template-jeffpast-php div.cellleft {display: table-cell; width: 29%; padding-top: 1em; }
.page-template-template-jeffpast-php div.cellmiddle {display: table-cell; width: 26%; vertical-align: top; padding-top: 2.5em; background-color: #000; color: #fff;}
.page-template-template-jeffpast-php div.cellright {display: table-cell; width: 24%; padding-left: 33px; }

.page-template-template-jeffpast-php div.cellleft img a{ display: block; border: 0; max-width: 100%; }
.page-template-template-jeffpast-php div.cellright img a{ display: block; border: 0; max-width: 100%; }

/* Link color for Past 7 */
.parent-pageid-424 a {color: #ccc;}

只有一张图片的其他网页似乎工作正常（例如：http://www.outtacontext.com/wp2/about/jeffs-past-the-beginning/）。

有人能告诉我应对这项工作的最佳方法吗？（如果这意味着使用不同的策略我会接受建议，但我发现这个系统在设计这三个元素时效果最好。）

使CSS表的内容响应

0 个答案: