Float div innen erstreckt

Question

Ich habe diesen Code in ein fiddle

Ich mag würde wissen, ob seine mögliche div Schwimmer im Text zu machen, wie seine folgenden Text?

.a { 
 
    position: relative; 
 
    width: 100px; 
 
    height: 40px; 
 
    background: red; 
 
}

<span>Pause and play icons will automatically be attached to every mp3 song in text. Like this for example: </span> 
 
<div class="a"></div><span> ut laoreet hendrerit mi. Nam vestibulum viverra diam. Nullam eros ipsum, rutrum ut, ultricies sed, congue sed, est. Pellentesque porttitor. Donec dictum urna eu mi. Maecenas in lorem.</span>

Answer 1

Verwendung display:inline-block zusammen mit vertical-align, wie Sie es Ihnen besser passen einstellen.

---

Um Benutzer auf Kommentare:

Dies gilt HTML, weil span ist Geschwister von div und nicht seine Eltern.

---

.a { 
 
    display: inline-block; 
 
    vertical-align: middle; 
 
    width: 100px; 
 
    height: 40px; 
 
    background: red; 
 
}

<span>Pause and play icons will automatically be attached to every mp3 song in text. Like this for example: </span> 
 
<div class="a"></div><span> ut laoreet hendrerit mi. Nam vestibulum viverra diam. Nullam eros ipsum, rutrum ut, ultricies sed, congue sed, est. Pellentesque porttitor. Donec dictum urna eu mi. Maecenas in lorem.</span>