0

さて、私は個人的な使用のために少しレイアウトを作っています.5列を並べてください. これまでのところ、次のものがあります。

<center>

<!DOCTYPE html>
<html>
<body>

<body style="background-color:#B0B0B0;">

</body>
</html>



<br><br>

<!DOCTYPE html>
<html>
<body>

<div style="font-family:verdana;padding:25px;border-radius:70px;border:8px solid black; width:800px; background-color:#D8D8D8;">

<iframe src="http://free.timeanddate.com/clock/i3nhi1p2/n889/fn17/fs20/tc777/ftb/bo2" frameborder="0" width="146" height="29"></iframe>

<br><br><br>


<style>

#columns {
    width: 250px;
}

#columns .column {
    position: relative;
    width: 46%;
    padding: 1%;
    border: solid 1px #000;
}

#columns .center {
    float: center;
}

</style>

<div id="columns">
<div class="center column">
TEXT GOES HERE
</div>
<div class="center column">
TEXT GOES HERE
</div>
<div id="columns">
<div class="center column">
TEXT GOES HERE
</div>
<div id="columns">
<div class="center column">
TEXT GOES HERE
</div>
<div id="columns">
<div class="center column">
TEXT GOES HERE
</div>
</div>
<br><br>

</center>
</body>
</html>


</div>

</body>
</html>

</center>

問題は、列が横に並んでいるのではなく、互いに積み重ねられていることです。誰かが私を助けることができますか? ありがとう。

4

1 に答える 1