html - Placing an unknown width element on the right of a centered element without moving it -
i have text element centered text-align: center;
, want place element (a small inline <span>
) right of without affecting position.
neither of elements (and span
) have known size, can't use offsetting margin on left of text element. there way in pure css?
obligatory code doesn't work:
<div style="text-align: center;"> <h3 id="centered-text">my centered text</h3> <span class="to-the-right" style="background-color: blue;">badge</span> </div>
#centered-text { display: inline-block; } #to-the-right { display: inline-block; position: absolute; margin-left: 4px; }
<div style="text-align: center;"> <div id="centered-text">my centered text</div> <div id="to-the-right" style="background-color: blue;">badge</div> </div>
i made h3 not h3 because made badge appear weirdly high above title, corrected giving badge attribute "top: 10px;"
Comments
Post a Comment