Aligning DIV and SPAN text

I am placing a <span> within a <div>. The div text is 12px, and the span text is 10px bold. I would like to middle-align the span text with the div text. I tried bottom-padding the span text, but that didn’t work. Any suggestions for this newbie?

A span is an “inline” element, meaning that it’s designed to sit within a line of text etc. So things like padding don’t work quite the same. One way to deal with this is to give the span display: block; which will make it behave like a block level element. Another option is to use a <p> instead and give it a special class.

Feel free to post your code and some indication of how you want it to appear, and we can help further. :slight_smile:

<div>text text text text text text.<span>060112</span></div> is the code. The <div> is 12 px, and the <span> is 10px. I’m attempting to vertical-align the smaller-text span with the larger-text div. It only needs to move up 1px.

Thanks for the quick response, and I hope this is the info y’all need.

I’m assuming you want to middle-align it vertically? If so, put vertical-align:middle; on the <span>, and that should do the trick.

Thanks, Stevie! It worked!