html - 在用户登录的同一行显示徽标

Question

我已经为此苦苦挣扎了一段时间，并且即将认输。我想要做的是在浮动左侧显示徽标，并在同一行的浮动左侧显示用户欢迎。而不是在不同的线路上。这是我的样式表中的代码..请帮忙

header, footer, hgroup,
nav, section {
    display: block;
}

mark {
    background-color: #a6dbed;
    padding-left: 5px;
    padding-right: 5px;
}

.float-left {
    float: left;
}

.float-right {
    float: right;    
}

Answer 1

你可以删除float，使用

display:inline-block;

对于这两个元素（徽标和用户欢迎）。

Answer 2

没有标记无法理解。无论如何，从我的解释来看，你需要这个。

   Markup 

  <div class="logo">
    <img class="place-left" src="http://t1.gstatic.com/images?q=tbn:ANd9GcQf2S3rAr9N1AonEHJ4MyamBQPzlz_1wledD4A0GdbNzO6Xw-Qy" />
    <div class=""> Bugatti welcomes you</div>
 </div>


  Styles

 .place-left {
        float: left;
 }

 .logo {
      height: 40px;
      width: 200px;
      position: relative;
 }

 .logo img {
       height: 40px;
       width: 40px;
 }

 .logo .message {
       position: absolute;
       left: 50px;
       top: 10px;
 }

Answer 3

利用

Display: inline-block;

在徽标和用户登录元素上。