i have the following markup
<a class="block"><span class="inline">hello</span>world</a>
the <a> has a display:block … if i give the span.inline a margin-top:3px it also pushes down the text after it. here is a jsfiddle to see this behaviour
could anybody give me a hint why this is happening?
All
inlineelements on a row share the same line-height. If you think about it it makes sense. What would happen when you have multiple lines of text otherwise? It would be completely unreadable.In these situation the
vertical-alignattribute is what you have to work with. Read up on that and you should be fine.