0
我有一個.banner元素和一個h1標題。我想將此標題放在橫幅上，但是當我試圖保留它時，它似乎不是從橫幅頂部邊框縮進，而是從橫幅上方的元素縮進。爲什麼元素不是來自父級的邊距？
在屏幕截圖中，我使用了Chrome的工具，該工具顯示nav元素結束處的標題縮進。
什麼問題，我該如何解決？將非常感謝任何幫助和提示。
.container {
\t width: 1024px;
\t margin: auto;
\t
\t overflow: hidden;
}
a {
\t text-decoration: none;
}
/*
***********
* =banner
***********
*/
.banner {
\t background: url(../img/banner1.jpg);
\t width: 1024px;
\t height: 580px;
\t margin: auto;
}
.banner h1 {
\t text-align: center;
\t font-size: 100px;
\t font-weight: normal;
\t margin: 200px;
\t
}
/*
***********
* =nav
***********
*/
nav {
\t margin-left: -35px;
\t margin-top: 0;
\t margin-bottom: 0px;
\t position: relative;
}
nav li {
\t display: inline;
}
nav .left-nav {
\t margin-top: -20px;
\t margin-right: 0px;
\t width: 200px;
\t float: right;
\t position: relative;
\t padding-top: 20px;
}
#login {
\t position: absolute;
\t top: 11px;
\t right: 0;
}
header h3 {
\t text-indent: -9999px;
}
header h3:after {
\t clear: both;
\t display: block;
\t content: ' ';
\t visibility: hidden;
\t height: 1%;
}
header h3 a {
\t background: url(../img/cart.png) no-repeat;
\t width: 48px;
\t height: 44px;
\t position: absolute;
\t top: 10px;
\t left: 0;
\t padding: 0;
}
header h3 a:hover {
\t background-color: white;
}
nav a {
\t font-family: 'Indie Flower', cursive;
\t font-size: 26px;
\t letter-spacing: 3px;
\t margin-right: 5px;
\t color: #0d0d0d;
\t padding: 10px 5px;
}
nav a:hover {
\t background-color: #e8e8e8;
}\t <body>
\t \t <div class="container">
\t \t \t <header>
\t \t \t \t <nav>
\t \t \t \t \t <ul>
\t \t \t \t \t \t <li><a href="#">Прайслист</a></li>
\t \t \t \t \t \t <li><a href="#">Подбор букета</a></li>
\t \t \t \t \t \t <li><a href="#">Контакты</a></li>
\t \t \t \t \t \t <li><a href="#">Доставка</a></li>
\t \t \t \t \t \t <div class="left-nav">
\t \t \t \t \t \t \t <li><h3><a href="#" ></a>Корзина</h3></li>
\t \t \t \t \t \t \t <li><a href="#" id="login">Войти</a></li>
\t \t \t \t \t \t </div>
\t \t \t \t \t </ul>
\t \t \t \t </nav>
\t \t \t \t <div class="banner">
\t \t \t \t \t <a href="#" id="left"></a> <!-- image replacement лучше сделать в css без картинки -->
\t \t \t \t \t <a href="#" id="right"></a> <!-- image replacement -->
\t \t \t \t \t <h1>Цветочный Дом Полины</h1>
\t \t \t \t \t <ul>
\t \t \t \t \t \t <li id=visited><a href="#"></a></li>
\t \t \t \t \t \t <li><a href="#"></a></li>
\t \t \t \t \t \t <li><a href="#"></a></li>
\t \t \t \t \t </ul>
\t \t \t \t </div>
\t \t \t </header>
\t \t \t
\t \t \t <div class="main">
\t \t \t \t <div class="news">
\t \t \t \t \t <h2>Новости нашего магазина</h2>
\t \t \t \t \t <p>
\t \t \t \t \t \t Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur.
\t \t \t \t \t </p>
\t \t \t \t \t <img src="#" alt="Heart-shaped box of flowers">
\t \t \t \t </div>
\t \t \t \t
\t \t \t \t <div class="portfolio">
\t \t \t \t \t <h2>Наши последние работы</h2>
\t \t \t \t \t <div class="image-container">
\t \t \t \t \t \t <img src="#" alt="Пример 1">
\t \t \t \t \t \t <img src="#" alt="Пример 2">
\t \t \t \t \t \t <img src="#" alt="Пример 3">
\t \t \t \t \t </div>
\t \t \t \t \t <p>
\t \t \t \t \t \t Во все времена цветы олицетворяют счастье, улыбку, радость, прекрасное настроение и чудеса. Именно цветами Вы можете рассказать о своих чувствах дорогим сердцу людям, поэтому многие тысячелетия люди стараются украсить свою жизнь и жизнь близких этими ароматными малышками. В любой момент жизни цветы порадуют и вызовут искреннюю улыбку на лице.
\t \t \t \t \t </p>
\t \t \t \t </div>
\t \t \t </div>
\t </body>
你可以添加一張你想如何看的截圖嗎？我不確定我是否理解了預期的結果。 – Stuart
喜歡這個[鏈接]（http://i.imgur.com/p9EUx9l.png） – Iskorka
我用過定位，但我仍然想知道邊緣有什麼問題 – Iskorka