2つのdiv <> insideのCSSフォーム

Question

2つのdiv <>私は互いに隣り合っていたいと思います。彼らは形の中にあります<>。私が左に持っているものはずっと浮き上がっていません。私の第一部がそれを阻止し続けているようです。私はそれを複数回サイズ変更していますが、それでも動作しません。ここに私のCssコードがあります。あなたが見ることができるように、それほど多くはありません。私はインラインスタイルもありません。私の最初のDivはContactInputと呼ばれ、私の2番目のDivは不可視と呼ばれます

#body {    
     border: 1px double black; 
     } 

#checkout {     //this is just a head at the top 
    text-align:left; 
    border-bottom: 1px solid black; 
    } 
#contactInput{ 
    clear:right; 
    padding:.5em; 

    } 

#invisible{ 
    float:right; 
    padding:.5em; 

    } 

Answer 1

このようにしますか？

#contact { 
 
    width: 50%; 
 
    padding:.5em; 
 
    background: blue; 
 
    float: left; 
 
    box-sizing: border-box; 
 
} 
 
#invisible { 
 
    width: 50%; 
 
    padding:.5em; 
 
    background: red; 
 
    float: left; 
 
    box-sizing: border-box; 
 
}

<div id="contact"> 
 
</div> 
 
<div id="invisible"> 
 
</div>

私の代わりにfloat

.wrap { 
 
    display: flex; 
 
} 
 
#contact { 
 
    flex: 1; 
 
    padding:.5em; 
 
    background: blue; 
 
} 
 
#invisible { 
 
    flex: 1; 
 
    padding:.5em; 
 
    background: red; 
 
}

<div class="wrap"> 
 
    <div id="contact"> 
 
    </div> 
 
    <div id="invisible"> 
 
    </div> 
 
</div>