Question

我无法找到获得my sidebar and main content area to be in line with each other的方法。我能做什么？我不认为我知道如何编辑我的内容宽度。我试图改变侧边栏的边距，但这只会将侧边栏放在我的内容之上。我希望他们在彼此身边。

/*
Theme Name: Wordpress Test
Author: Linh Nguyen
Author URI: *mylink*
Version: 1.0
*/

body {
    font-family: 'Cardo', serif;
    font-size: 13px;
    color: #3d3d3d;
}

a:link,
a:visited {
    color: black;
    text-decoration: none;
}

p {
    line-height:13px;
}

h1, h2 {
    font-family: 'Montserrat', sans-serif;
    text-transform: uppercase;
}

h5 {
   font-size: 0;
   text-indent: -1000px; }


/* General Layout */
div.container {
    max-width: 950px;
    margin: 0 auto;
    padding-left: 20px;
    padding-right: 20px;
}

#header {
    background: url(http://localhost:8888/wordpress/wp-content/uploads/2015/07/header-e1437695892390.jpg) 
  no-repeat top center; }
#headerimg  {
    margin-top: 0px; 
    padding-bottom: 20px;
    height: 130px; 
    width: 500px; }

#sidebar {
    float: left;
}

Answer 1

有不同的方式，其中一种看起来像这样：

#content {
  float: left;
  width: 75%;    
}
#sidebar {
  float: right;
  width: 25%;   
}

请参阅此处的示例：http://jsfiddle.net/9a0eah5j/

Answer 2

你有几个问题：

您需要将两个div向左浮动

由于容器div上的填充，您无法给它们100％的总宽度。

.container {
  float: left;
  width: 75%;
}
.sidebar {
  float: left;
  width: 20%;
}

课程＆＃39;侧栏＆＃39;应该应用于包装器div，而不是UL：
```
<div class="sidebar">
  <ul>
    ...sidebar content
  </ul>
</div>
```

您的侧边栏div不能嵌套在类容器中。

<div class="content">
  Main Content
</div>
<div class="sidebar">
  Sidebar content
</div>

Wordpress主题：如何让侧边栏位于主要内容旁边

2 个答案: