在窗口调整大小时有一个固定的宽度

时间:2014-12-03 13:19:38

标签: html css

我是以下HTML。

  <div class="chapter">
        <ol class="eng-orderedlist orderedlist">
            <li class="item">
                <div class="para">
                    <span class="item-num">4.</span>

                    <ol class="eng-orderedlist orderedlist">

                        <li class="item">
                            <div class="para">
                                <span class="item-num">(a)</span>
                                In Safari advanced settings I have 14MB of website data. Some entries have a large amount of data such as mail.google.com with 4.3 MB. Google Mail in Safari is web based and I have no offline content except 1 small unread message in my inbox. My contacts are not available when wifi or mobile is not connected so what is the "Webdata" and what would I delete if I deleted it?
                                <table class="frame-bot">
                                    <colgroup>
                                        <col class="colname-col1 colwidth-25%">
                                        <col class="colname-col2 colwidth-50%">
                                        <col class="colname-col3 colwidth-25%">
                                    </colgroup>
                                    <tbody>
                                        <tr>
                                            <td align="left" valign="bottom">[2014]</td>
                                            <td align="center" valign="bottom">
                                                <span class="font-style-italic">Thanks giving happy holiday
                                                </span></td>
                                            <td align="right" valign="bottom">1</td>
                                        </tr>
                                    </tbody>
                                </table>
                                This is content after table

                            </div>
                        </li>
                    </ol>
                </div>
            </li>
        </ol>

    </div>

这里有一个表格(frame-bot),我给它全宽(当我们最大化浏览器时它从左到右完全延伸),但是当我重新调整浏览器大小(缩小)时出现问题,这里表缩小并变小,即它不会触及页面的末端。当您在全屏幕中运行以下代码段时,您可以看到效果,当您重新调整大小时,表格会变得更小。

请让我知道我哪里出错了以及如何解决这个问题。

&#13;
&#13;
div.chapter ol.orderedlist li.item div.para ol.orderedlist li.item div.para table.frame-bot {
  width: 106.5%;
  border-bottom: 1px solid black;
  margin-bottom: 2em;
  margin-left: -7em;
}
.orderedlist {
  margin-top: 0em;
  margin-bottom: 0em;
  margin-left: 1.85em;
}
.orderedlist .item {
  list-style: none;
}
.orderedlist li.item div.para {
  margin-left: 0em;
  text-indent: 0em;
  margin-bottom: 0em;
}
.orderedlist li.item div.para span.item-num {
  margin-left: -2.5em;
  padding-right: 1em;
  text-indent: 0em;
  display: block;
  float: left;
  text-align: right;
}
.orderedlist .orderedlist {
  margin-left: -2em;
}
.orderedlist .orderedlist li.item div.para {
  text-indent: 0em;
  margin-left: 2em;
}
.orderedlist .orderedlist li.item div.para span.item-num {
  margin-left: -2.5em;
  margin-right: 0em;
}
&#13;
<div class="chapter">
  <ol class="eng-orderedlist orderedlist">
    <li class="item">
      <div class="para">
        <span class="item-num">4.</span>

        <ol class="eng-orderedlist orderedlist">

          <li class="item">
            <div class="para">
              <span class="item-num">(a)</span>
              In Safari advanced settings I have 14MB of website data. Some entries have a large amount of data such as mail.google.com with 4.3 MB. Google Mail in Safari is web based and I have no offline content except 1 small unread message in my inbox. My contacts are not available when wifi or mobile is not connected so what is the "Webdata" and what would I delete if I deleted it?
              <table class="frame-bot">
                <colgroup>
                  <col class="colname-col1 colwidth-25%" />
                  <col class="colname-col2 colwidth-50%" />
                  <col class="colname-col3 colwidth-25%" />
                </colgroup>
                <tbody>
                  <tr>
                    <td align="left" valign="bottom">[2014]</td>
                    <td align="center" valign="bottom">
                      <span class="font-style-italic">Thanks giving happy holiday
                                                </span>
                    </td>
                    <td align="right" valign="bottom">1</td>
                  </tr>
                </tbody>
              </table>
              This is content after table

            </div>
          </li>
        </ol>
      </div>
    </li>
  </ol>

</div>
&#13;
&#13;
&#13;

0 个答案:

没有答案