把两个元素彼此相邻，并且两者仍有余量

Question

我在写作时似乎遇到了这个问题。我在同一行上有两个元素。我需要他们都有利润率，因此不能将他们的职位设置为absolute。如果我没有设置第一个元素的位置，它看起来很好。但是，第二个元素将出现在第一个元素下面。这不好;我希望他们出现在同一行上。换句话说，我想将这两个元素设置为position: absolute; top: 0;，但后来我无法使用保证金，这是我需要的。

HTML：

#userQuestion{ 
//border: 1px solid yellow; 
width: 400px; 
position: relative; 
top: 0px; 
left: 40px; 
line-height: 1.28; 
display: inline-block; 
} 

.container{ 
padding: 0; 
margin 0; 
border-top: 1px solid #ccc; 
//border: 1px solid blue; 
margin-top: 30px; 
width: 480px; 
} 

HTML：

<div id='userQuestion'></div> //this is fine 
<div class='container'></div> //this appears underneath userQuestion. I would like them to be on the same line. 

Answer 1

尝试以下操作：

.container { 
    border-top: 1px solid #CCCCCC; 
    display: inline-block; 
    margin-top: 30px; 
    padding: 0; 
    width: 480px; 
}