0
<!DOCTYPE html>
<html>
    <head>
        <title></title>
        <meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
        <style>
            .child {
                background-color: red;
                width:33.3%;
                height:200px;
                float:left;
            }

            .wraper {
                width:80%;
                height:600px;
                margin:auto;
                background-color: blue;
            }
        </style>
    </head>
    <body>
        <div class="wraper">
            <div class="child">
                <p>some text</p>
            </div>
            <div class="child">
                <p>some text</p>
            </div>
            <div class="child">
                <p>some text</p>
            </div>
        </div>
    </body>
</html>

少しレイアウトを設定しようとしましたが、奇妙なことに疑問に思っています。子の幅を 33.3 3 % に設定する必要があります。そうしないと、右側に少しスペースができてしまいます。それは正しい方法ですか?似たようなもの: 5px の子の周りに境界線を設定したい場合はどうすればよいでしょうか。どのパーセンテージ数が適合するかを実際に試す必要がありますか? または、ボーダー、マージン、パディングを含む子の全幅を固定パーセンテージに設定する別の方法はありますか? これらがhtmlでどのように機能するかについて少し説明が必要だと思います。

4

1 に答える 1