Question

这是我第一次真正尝试自己设计一些东西。我正在使用Underscores Wordpress基本主题。我有很多主要菜单的基础知识，但我的主要网站内容被困在其中。菜单应位于左侧，内容位于右侧。

链接：

http://robkaufmanshow.com/strictlyecw/?page_id=2

菜单代码;

.main-navigation {
clear: both;
display: block;
width: 170px;
float: left;
background-image: url('http://robkaufmanshow.com/strictlyecw/wp-content/uploads/2014/02/menubg.png');
}
.main-navigation ul {
list-style: none;
margin: 0;
padding-left: 0;
}
.main-navigation li {
float: left;
position: relative;
}
.main-navigation a {
font-family: chiller;
font-size: 18px;
color: #fff;
display: block;
text-decoration: none;
padding: 2px;
line-height: 20px;
width: 155px;
vertical-align: middle;
text-align: center;
}
.main-navigation ul ul {
box-shadow: 0 3px 3px rgba(0, 0, 0, 0.2);
display: none;
float: left;
left: 0;
position: absolute;
top: 1.5em;
z-index: 99999;
}
.main-navigation ul ul ul {
left: 100%;
top: 0;
}
.main-navigation ul ul a {
width: 170px;
}
.main-navigation ul ul li {
}
.main-navigation li:hover > a {
background-image: url('http://robkaufmanshow.com/strictlyecw/wp-content/uploads/2014/02/menubg02.png');
}
.main-navigation ul ul :hover > a {
}
.main-navigation ul ul a:hover {
}
.main-navigation ul li:hover > ul {
display: block;
}
.main-navigation .current_page_item a,
.main-navigation .current-menu-item a {
}
/* Small menu */
.menu-toggle {
cursor: pointer;
display: none;
}
@media screen and (max-width: 600px) {
.menu-toggle,
.main-navigation.toggled .nav-menu {
    display: block;
}

.main-navigation ul {
    display: none;
}
}
.site-main [class*="navigation"] {
margin: 0 0 1.5em;
overflow: hidden;
}
[class*="navigation"] .nav-previous {
float: left;
width: 50%;
}
[class*="navigation"] .nav-next {
float: right;
text-align: right;
width: 50%;
}

Answer 1

使用它。

#masthead{
   float:left;
}

为了将来的目的，请使用侧边菜单。标题应该是标题。

Answer 2

尝试将此添加到您的css：

#site-navigation{
float:left;
clear:none;
}

#main{
float:left;
clear: left;
}

主要网站内容停留在左侧导航菜单下

2 个答案: