Jquery HTML元素不在同一行上

我知道这个问题在这里被问了很多，但我觉得这个问题的解决方案会因CSS周围的元素而大不相同

总之，我这里有一个jQuery：

$(".classDiv").append("<h4>"+name+"</h4> - <h5>"+teacher+"</h5>");

$（.classDiv”）.append（“+name+”-“+teacher+”）；

和我的HTML/CSS：

<div class="classDiv" style="margin-top: 100px;"></div>

.classDiv {
    margin: 0 0 20px; 
    padding: 5px 0 0; 
    border: 1px solid #d8d8d8; 
    background: #f9f9f9;     
    -moz-border-radius: 4px; 
    -webkit-border-radius: 4px; 
    border-radius: 4px; 
    -moz-box-shadow: inset 0 0 0 1px #fff;
    -webkit-box-shadow: inset 0 0 0 1px #fff;
    box-shadow: inset 0 0 0 1px #fff; 
}

.classDiv{
利润率：0.20px；
填充：5px0；
边框：1px实心#d8d8；
背景#f9f9f9；
-moz边界半径：4px；
-webkit边界半径：4px；
边界半径：4px；
-moz盒阴影：插入0 1px#fff；
-webkit盒阴影：插入0 1px#fff；
框阴影：插入0 1px#fff；
}

我希望我的名字和老师的文字在同一行。我尝试过一些方法，比如使用

display:inline block:

创建一个环绕的div，但它似乎不起作用

以下是正在发生的事情：

这里使用

和

是完全不合适的

---

如果需要，可以使用

s和

类将它们设计得更大。
我建议使用与h4和h5不同的样式。执行相同的操作，但使用span代替
$（“.classDiv”）。追加（“+name+”-“+teacher+”）

如果您想为它们设置样式，只需为它们设置类并使用css字体属性即可。


默认情况下，Gl和REVICE头元素（如h4和h5）的显示为block。块级元素彼此堆叠在一起，而内联元素在页面流中彼此堆叠在一起。如果更改CSS使h4和h5都成为内联元素，它们将彼此相邻：

.classDiv h4, .classDiv h5 {
    display: inline; /* or inline-block would work too */
}

h1-h6、p和其他各种元素都是自动块元素。.classDiv h4、.classDiv h5{display:inline}感谢BootstrapThemer。很好知道。@Nicolas，spans是内联的，但是如果在语义上合适的话，使用h1-h6是可以的。但是，如果必须使用h4和h5，则对它们都使用
display:inline
，而不使用div进行包装，需要进一步解释。