Question

守则：

<html>
    <head>
        <style type="text/css">
        div{border:solid 1px gray;}
        #mainDiv
        {
            width:300px;
        }
        .leftDiv
        {
            display:table-cell;
            width:50%;
        }
        .rightDiv
        {
            display:table-cell;
            width:50%;
        }
        </style>
    </head>
    <body>
        <div id="mainDiv">
         <div class="titleDiv">
            ...titleDiv content...
         <div>
         <div class="leftDiv">
            ...leftDiv content...
         </div>
         <div class="rightDiv">
            ...rightDiv content...
         </div>
       </div>
    </body>
</html>

我遇到的问题是leftDiv和rightDiv只有达到足够的内容才能达到全宽。

这对我来说是个问题，因为我想在leftDiv中只播放一个单词并将其与右侧对齐。

Answer 1

<html>
    <head>
        <style type="text/css">
        div{border:solid 1px gray;}
        #mainDiv
        {
            width:300px; 
            overflow:auto;
        }
        .float
        {
            float:left;
            width:50%;
        }
        </style>
    </head>
    <body>
        <div id="mainDiv">
         <div class="titleDiv">
            ...titleDiv content...
         <div>
         <div class="float">
            ...leftDiv content...
         </div>
         <div class="float">
            ...rightDiv content...
         </div>
       </div>
    </body>
</html>

Answer 2

你可以使用

text-align:right

如何在没有内容的情况下将div宽度设置为full？

2 个答案: