Question

<html>
  <body>
    <h1>header</h1>
    <header style='border-bottom:solid black; height:64px'>
      <h1 style = 'text-align: left; display:inline-block'>
      $CName($CSymbol)</h1>
      <span style='padding-left:7px'>$firstN $secondN($thirdN%)</span>
    </header>

<table width='1340px'>
<tr>
   <td>Prev Close:</td>
   <td align='right' style='padding-right:30px;'>$prevClose</td>
   <td>Day's Range:</td>
   <td align='right'>$daysRange</td>
<tr>
   <td>Open:</td>
   <td align='right' style='padding-right:30px;'>$open</td>
   <td>52wkRange:</td>
   <td align='right'>$yearsRange</td>
</tr>
<tr>
   <td>Bid:</td>
   <td align='right' style='padding-right:30px;'>$bid</td>
   <td>Volume:</td>
   <td align='right'>$volume</td>
</tr>
<tr> 
   <td>Ask:</td>
   <td align='right' style='padding-right:30px;'>$ask</td>
   <td>Avg Vol(3m):</td>
   <td align='right'>$avgVol</td>
</tr>

<tr>
    <td>1y Target Est:</td>
    <td align='right' style='padding-right:30px;'>$targetEst</td>
    <td>Market Cap:</td>
    <td align='right'>$marketCap</td>
</tr>
</table>

</body>
</html>

代码在FF中运行良好，但是如果我调整浏览器的大小，“标题”仍然在中心，但是表格和底部边框已超出视图，如何修复此问题以便无论我如何重新浏览器的大小，内容仍然适合。谢谢 befor resize

after resize

Answer 1

您需要使用最大和最小宽度

<table style="max-width:1340px; min-width:800px'>

或者100％

Answer 2

您的<table>有固定宽度。将其更改为％值（即100％）将确保它符合浏览器的宽度。

这是一个近似你想要的jsfiddle：http://jsfiddle.net/9paab/

Answer 3

您需要设置

<table style='width:100%'>

此表适合其容器的宽度

如何让表格适合html中的浏览器大小？

3 个答案: