-2
screenshot 我正在試用Flexbox。建立一個菜單。我沒有定義頁邊空白，但我的菜單被從側面推出。這是一個錯誤？任何其他想法？我真的堅持flexbox left margin css
`
<html>
<head>
<title>Ribbit - A flexbox Project</title>
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<link href='https://fonts.googleapis.com/css?family=Open+Sans' rel='stylesheet' type='text/css'>
<style type="text/css">
body {
background-color: #ff9;
font-family:"Open Sans", "Helvetica Neue", Helvetica, Arial, sans-serif;
}
.row,
.columns,
nav ul {
display: flex;
flex-direction: column;
}
.row {
background-color: rgba(255,255,255, .33);
border: 1px solid rgba(150,150,150, .66);
}
.columns {
background-color: rgba(200,200,200, .5);
border: 1px solid rgba(150,150,150, .66);
}
nav ul {
text-transform:uppercase;
font-size: .75rem;
font-weight: 900;
letter-spacing: .025rem;
list-style: none;
border: 1px solid orange;
}
nav ul li {
background-color: rgba(0,0,0, .9);
padding: .75em 1em;
border-bottom: 1px solid white;
color: #fff;
}
@media (min-width: 769px) {
body {
background-color: #f9f;
}
nav ul {
flex-direction: row;
}
nav ul li {
display: flex;
flex: 1;
}
}
@media (min-width: 1024px) {
body {
background-color: #9ff;
}
}
</style>
</head>
<body>
<div class="row">
<header class="row">
<h1>Flexbox <span>Inc.</span></h1>
</header>
</div>
<nav>
<ul class="row">
<li class="item">One</li>
<li class="item">Two</li>
<li class="item">Three</li>
<li class="item">Four</li>
<li class="item">Five</li>
</ul>
</nav>
<div class="content row">
<div class="main">
<img src="http://placehold.it/1024x512/B4081E/ffffff/" width="100%" height="auto" alt="screenshot">
<p>Cause longer included relaxing deal world's if. Calories world's one style refreshing worthwhile win newer world's introducing better class.</p>
<p>Wholesome sleek below advanced crispy save spring elegent. Sold worthwhile spacious oily hearty. On screamin' tangy dazzling.</p>
<p>What appearance big credit-card bonus asked polished. More light sensible picky devour each appetizing newest duty people. Extra gigantic thank-you.</p>
<p>Absorbent vinyl thick industry now. Unique to thirsty absolutely settle smooth.</p>
</div>
<div class="aside"></div>
<div class="promo"></div>
</div>
<footer class="row">
<div class="columns">
<p>Twitter: this</p>
<p>Facebook: this</p>
<p>LinkedIN: this</p>
<p>Pinterest: this</p>
</div>
<div class="columns">
<p>Cause longer included relaxing deal world's if. Calories world's one style refreshing worthwhile win newer world's introducing better class.</p>
<p>Wholesome sleek below advanced crispy save spring elegent. Sold worthwhile spacious oily hearty. On screamin' tangy dazzling.</p>
<p>What appearance big credit-card bonus asked polished. More light sensible picky devour each appetizing newest duty people. Extra gigantic thank-you.</p>
<p>Absorbent vinyl thick industry now. Unique to thirsty absolutely settle smooth.</p>
</div>
<div class="columns"><p>© 2005 Flexbox inc.</p></div>
</footer>
</body>
</html>
`
我很困惑，爲什麼沒有對菜單
你能發佈你的代碼嗎？ –
http://stackoverflow.com/help/how-to-ask –
已添加代碼 – MAILO