0
我試圖找到問題，但不能，因爲它似乎有點複雜。從旁邊的圖片移動表
正如你可以在摘要中看到，表頭與IMG共同聲明div的重量，如果第二臺旁邊的圖像，具有較大的權重，然後第一個，那麼它只是下運行。我想知道一個「乾淨」的解決方案，不管是否使用像這樣的float都是錯誤的，等等，因爲我可以設置第一個表的更大的靜態重量，並且這將解決整個問題。 （我只是改變了文本「專業」爲「教授」，因爲它減少了表的重量和導致問題出現）
#gameContainer {
\t margin-top: 20px;
}
#character {
\t text-align: center;
\t font-size: 18px;
}
#gameTitle {
\t font-family: GameFont;
\t font-size: 70px;
\t margin-bottom: 50px;
\t text-align: center;
}
#attributes td {
\t padding-left: 10px;
}
#explore {
\t margin-top: 45px;
\t text-align: center;
}
.bttn:hover {
\t cursor: pointer;
}
.bttn {
\t box-shadow: 0.5px 0.5px 3px black;
\t width: 24px;
}
#lvl {
\t margin-top: 30px;
}
#start {
\t margin-top: 45px;
}
#Log {
\t text-align: center;
\t margin-left: 5%;
\t margin-right: 5%;
}
#point {
\t margin-top: 45px;
\t font-size: 21px;
\t font-weight: bold;
}
#lvl {
\t margin-bottom: 0px;
\t font-size: 24px;
\t font-weight: bold;
}
#exp {
\t margin-bottom: 0px;
\t margin-top: 10px;
\t font-size: 16px;
}
#neededExp {
\t margin-top: 5px;
\t font-size: 16px;
}
#gold {
\t margin-top: 30px;
\t font-weight: bold;
}
#mainAttributes {
\t text-align: left;
\t font-weight: bold;
\t font-size: 24px;
\t padding-bottom: 45px;
}
#attributes{f
\t text-align: left;
\t font-size: 20px;
\t display: inline-block;
}
.logEntries {
\t display: none;
}
.choiceBtn {
\t margin-left: 5%;
\t margin-top: 3%;
}
.death {
\t color: red;
\t font-weight: bold;
}
.boldUp {
\t font-weight: bold;
}
.optionMenuBtn {
\t margin-left: 5%;
\t margin-top: 3%;
}
#optionMenu {
\t text-align: center;
\t display: none;
}
.optionMenuBtn:nth-child(1) {
\t margin-left: 0px;
}
#actionMenu {
\t text-align: center;
}
.actionMenuBtn {
\t margin-left: 5%;
}
.actionMenuBtn:nth-child(1) {
\t margin-left: 0px;
}
.choiceBtn:nth-child(1) {
\t margin-left: 0px;
}
.playerAttack {
\t text-align:left;
}
.enemyAttack {
\t text-align: right;
}
#battleLog {
\t margin-left: 35%;
\t margin-right: 35%;
\t margin-top: 10%;
\t text-align: center;
}
#battleLog h1 {
\t font-size: 50px;
\t margin-bottom: 10%;
}<!DOCTYPE html>
<html>
<head>
\t <meta charset="UTF-8">
</head>
<body>
\t <div id="gameContainer">
\t \t <h1 id="gameTitle">Your character</h1>
\t \t <div id="character">
\t \t \t <div id="attributes">
\t \t \t \t <img src="https://i.pinimg.com/736x/51/0d/99/510d992e8ef64fe523a025208fbf8f5e--fantasy-images-elf.jpg" style="width: 260px; margin-right: 20px; box-shadow: 0px 0px 10px black; float: left;"> \t
\t \t \t \t <table id="mainAttributes">
\t \t \t \t \t <tr>
\t \t \t \t \t \t <td>Name:</td>
\t \t \t \t \t \t <td><span id="name"></span></td>
\t \t \t \t \t </tr>
\t \t \t \t \t <tr>
\t \t \t \t \t \t <td>Race:</td>
\t \t \t \t \t \t <td><span id="race"></span></td>
\t \t \t \t \t </tr>
\t \t \t \t \t <tr>
\t \t \t \t \t \t <td>Prof:</td>
\t \t \t \t \t \t <td><span id ="profession"></span></td>
\t \t \t \t \t </tr>
\t \t \t \t </table>
\t \t \t \t <table>
\t \t \t \t \t <tr>
\t \t \t \t \t \t <td><span>Strength:</span></td>
\t \t \t \t \t \t <td><span id="strength"></span></td>
\t \t \t \t \t </tr>
\t \t \t \t \t <tr>
\t \t \t \t \t \t <td><span>Endurance:</span></td>
\t \t \t \t \t \t <td><span id="endurance"></span></td>
\t \t \t \t \t </tr>
\t \t \t \t \t <tr>
\t \t \t \t \t \t <td><span>Dexterity:</span></td>
\t \t \t \t \t \t <td><span id="dexterity"></span></td>
\t \t \t \t \t </tr>
\t \t \t \t \t <tr>
\t \t \t \t \t \t <td><span>Intelligence:</span></td>
\t \t \t \t \t \t <td><span id="intelligence"></span></td>
\t \t \t \t \t </tr>
\t \t \t \t \t <tr>
\t \t \t \t \t \t <td><span>Charism:</span></td>
\t \t \t \t \t \t <td><span id="charism"></span></td>
\t \t \t \t \t </tr>
\t \t \t \t </table>
\t \t \t </div>
</body>
</html>