1
我仍然在學習html和css，試圖找出一切正常，沒有任何編碼經驗。請原諒我，如果我問一個愚蠢的或完全多餘的東西。Div與div（HTML/CSS）重疊？
基本上，我有3個div，我正在努力。 2個div位於頁面的最頂端，均爲徽標。一個在左上角，一個在右上角。 我的第三個div，對於導航欄，並沒有在它們下面，而是與它們重疊。
我應該只用<br>來處理它嗎？
引用的圖像是本地的。請參閱http://ddlgaming.com/giga/獲取實時版本。
預先感謝您！
我的代碼如下所示（請忽略所有的顏色，他們幫助我更好看）：
CSS和HTML：
.clearfix \t {
\t \t \t clear: both;
\t \t \t }
body
\t \t \t {
\t \t \t background-color: rgb(21,14,43);
\t \t \t background-image: url("../images/backgroundimage.jpg");
\t \t \t background-size: cover;
\t \t \t background-repeat: no-repeat;
\t \t \t background-attachment: fixed;
\t \t \t min-height: 100%;
\t \t \t background-position: center center;
\t \t \t overflow: hidden;
\t \t \t }
\t
#gigalogomainbox
\t \t \t {
\t \t \t float: left;
\t \t \t width: 30vw;
\t \t \t height: 10vw;
\t \t \t overflow: hidden;
\t \t \t transform: skewX(20deg);
\t \t \t margin: 0 0 0 -4vw;
\t \t \t }
\t \t \t
#gigalogobox
\t \t \t {
\t \t \t margin: 0 3vw 0 2vw;
\t \t \t padding: 0 0 0 2vw;
\t \t \t width: 100%;
\t \t \t height: 8vw;
\t \t \t }
\t
#gigalogo
\t \t \t {
\t \t \t width: 80%;
\t \t \t margin: 3vw 2vw 0 0;
\t \t \t height: 7vw;
\t \t \t }
\t \t \t
#steamlogomainbox
\t \t \t {
\t \t \t width: 15vw;
\t \t \t height: 10vw;
\t \t \t float: right;
\t \t \t margin: 0 -4vw 0 0;
\t \t \t background-color: white; /*000c21*/
\t \t \t transform: skewX(-20deg);
\t \t \t overflow: hidden;
\t \t \t }
\t \t \t \t \t
#steamlogobox
\t \t \t {
\t \t \t margin: 0 -2vw 0 3vw;
\t \t \t padding: 0;
\t \t \t width: 100%;
\t \t \t height: 20%;
\t \t \t }
#steamlogo
\t \t \t {
\t \t \t padding: 0 0 0 2vw;
\t \t \t margin: 3vw 0vw 0 0;
\t \t \t transform: skewX(20deg);
\t \t \t height: 7vw;
\t \t \t }
#placeholderbartop
\t \t \t {
\t \t \t float: left;
\t \t \t width: 60%;
\t \t \t margin: 0;
\t \t \t padding: 0;
\t \t \t height: 10vw;
\t \t \t }
\t \t \t
#navbarbox \t \t \t
\t \t \t {
\t \t \t display: block;
\t \t \t width: 100%;
\t \t \t height: 5vw;
\t \t \t margin: 0vw;
\t \t \t background-color: white;
\t \t \t }
#navbar, #navbar ul
\t \t \t {
\t \t \t width: 100%;
\t \t \t height: 5vw;
\t \t \t margin: 0;
\t \t \t background-color: green;
\t \t \t }
\t \t \t
#navbar li
\t \t \t {
\t \t \t color: white;
\t \t \t list-style: none;
\t \t \t display: inline-block;
\t \t \t padding: 1vw;
\t \t \t color: red;
\t \t \t font-size: 30px;
\t \t \t }
\t \t \t<!DOCTYPE html>
<html>
<head>
<link href="css/mainframe.css" type="text/css" rel=stylesheet>
<script src="scripts/jquery.js"></script>
<body>
<!--Giga logo, top left--!>
<div id="gigalogomainbox" class="clearfix">
\t <div id="gigalogobox">
\t \t <img id="gigalogo" src="images/gigalogo.png">
\t </div>
\t <div class="clearfix">
\t </div>
</div>
<!--Steam logo, top right--!>
<div id="steamlogomainbox">
\t <div id="steamlogobox">
\t \t <img id="steamlogo" src="images/steamlogo.png">
\t </div>
\t <div class="clearfix">
\t </div>
</div>
<!--navigation barrrrrr--!>
<div id="navbarbox">
\t <ul id="navbar">
\t \t <li>Home</li>
\t \t <li>Servers</li>
\t \t <li>Community</li>
\t \t <li>Store</li>
\t \t <li>Download</li>
\t \t <li>Contact</li>
\t </ul>
</div>
</body>
</html>
首先，你的HTML是打破ñ。評論應該是'<！ - Comment - >'。修理它。接下來，關於'br'的第二個問題。使用'br'解決視覺問題並不好。 –
我們不在這裏的標題中做「已解決」。如果您或其他人回答了您的問題，您可以將其標記爲允許其他人知道。 – j08691
抱歉，我不知道:( – Mark