Question

好的，所以这里是我的问题我有一个网站，在中间我有一个部分和一边。页面上的其他所有内容都是100％，但是除了我想要等于80％并且我在中间彼此并排排列。但我得到了这个。

图片：https://twitter.com/iamalecgrogan/status/392454057345810432/photo/1

在你开始说的东西之前，我已经尝试了每一个做桌子单元格和表格的对齐和内嵌块元素创建一个div让他们进入。但没有任何工作，请帮助。这是我的代码。

<!DOCTYPE html>

<html lang="en">

<head>

<meta charset="UTF-8">
<title>
Home | ProvideWebDesign
</title>
<link rel="stylesheet" type="text/css" href="styles/layout.css">
<link rel="stylesheet" type="text/css" href="styles/style.css">

</head>

<body>

<div id="wrapper">

<header id="header">

<div id="header_right">
</div>

<div id="header_left">
</div>

</header>

<nav id="nav">
</nav>

<section id="section">

<article id="section_article">
</article>

<article id="section_article2">
</article>

</section>

<aside id="aside">

<article id="aside_article">
</article>

<article id="aside_article2">
</article>

<article id="aside_article3">
</article>

</aside>

<footer id="footer">

<div id="footer_right">
</div>

<div id="footer_left">
</div>

</footer>

</div>

</body>

 </html>

CSS--------------------

 *
{
margin: 0px;
padding: 0px;
}

#wrapper
{
width: 100%;
height: 875px;
display: table;
}

#header
{
width: 100%;
height: 75px;
display: block;
}

#header_right
{
width: 50%;
height: 75px;
float: left;
display: block;
}

#header_left
{
width: 50%;
height: 75px;
float: left;
display: block;
}

#nav
{
width: 100%;
height: 50px;
display: block;
}

#section
{
  width: 60%;
height: 600px;
float: left;
display: table-cell;
}
#aside
{
width: 20%;
height: 600px;
float: left;
display: table-cell;
 }

#footer
{
width: 100%;
height: 150px;
display: block;
clear: both;
}

#footer_right
{
width: 50%;
height: 150px;
float: left;
display; block;
}

#footer_left
{
width: 50%;
height: 150px;
float: left;
display: block;
}

Answer 1

在该部分周围创建一个包含元素（如div），并为该容器提供80％的宽度，块显示和自动边距。丢失表格上的表格单元格并放在一边。为容器提供明确的修复：https://gist.github.com/jelmerdemaat/3804403

我的div不会在中间

1 个答案: