Question

中心和对齐在IE和Firefox上运行良好。我已经有很长一段时间没有做过HTML / CSS了，所以我不确定我做错了什么。我已经四处寻找，没有桌面中心对我有用。

    /* different things I tried to get to work */
    #table {
      display: table;
      text-align: center;
      margin-left: auto;
      margin-right: auto;
      table-layout: auto;
    }

    body {
      background-color: #ececec;
    }
    #navborderline {
      width: 50%;
      margin: auto;
      margin-top: 5px;
      height: 2px;
      background-color: black;
    }
    #navborder ul {
      text-align: center;
    }
    #navborder ul li {
      list-style-type: none;
      display: inline;
      margin-left: 5%;
      margin-right: 5%;
    }
    #navborder a {
      text-decoration: none;
      color: black;
      font-size: 18px;
      border-bottom: 1px solid transparent;
      -webkit-transition: all .3s ease-in-out;
      -moz-transition: all .3s ease-in-out;
      -o-transition: all .3s ease-in-out;
      transition: all .3s ease-in-out;
    }
    #navborder a:hover {
      border-bottom: 1px solid red;
    }
    #navborder {
      margin-top: 10px;
    }
    #table {
      width: 60%;
      margin: auto;
      margin-top: 5px;
      text-align: center;
    }
    #table td,
    tr {
      border: 1px solid black;
      width: 50%;
    }

<html>

<head>
  <title>Travis' Portfolio</title>
  <link rel="stylesheet" type="text/css" href="css/css.css" />
  <!--[if IE]>
                <link rel="stylesheet" type="text/css" href="css/ie.css" />
            <![endif]-->
  <link rel="stylesheet" type="text/css" href="css/reset.css" />
</head>

<body>
  <div id="navborder">
    <ul id="ie">
      <li><a href="#">Home</a>
      </li>
      <li><a href="#">Assignments</a>
      </li>
      <li><a href="#">Contact</a>
      </li>
      <li><a href="#">Random</a>
      </li>
    </ul>
  </div>

  <div id="mainbody">
    <table id="table">
      <thead>
        <tr>
          <td colspan="2">Ello</td>
        </tr>
      </thead>
      <tr>
        <td>Hello</td>
        <td>hello v2</td>
      </tr>
      <tr>
        <td>Hello</td>
        <td>hello v2</td>
      </tr>
    </table>
  </div>

  <div id="mainfooter"></div>
</body>

</html>

无法在CSS中居中表...（Internet Explorer）

0 个答案: