我需要将项目符号列表项与同一行中的其他文本对齐

Question

我希望带有文字的项目符号与其左侧div中的文本显示在同一行。我在另一个div右侧的div中创建了一个无序列表项，但是子弹和附带的文本显示在左侧div中的文本的下方。如何让带有文本的项目符号水平排列？我在下面粘贴我的代码。此外，响应者要求我在小提琴上发布我的代码并将链接粘贴到该帖子。这是链接：

https://jsfiddle.net/bartonlewis/0v9uh3Lq/2/

    家     巴顿刘易斯的家谱页面     

• 姓氏

#colA {
    width: 200px;
    float: left;
    font-size: 1.2em;
    font-weight: bold;
}
#colB {
    width: 546px;
    float: left;
    text-align: center;
    letter-spacing:.1em;
    font-weight: bold;
    font-variant: small-caps;
    font-size: 1.3em;
    }
#colC {
    width: 150px;
    float: right;
    font-size: 1.2em;
    }

Answer 1

根据我的理解，只需将其添加到您的样式表

即可

ul li { display:inline-block; float:left; }