zygoma — 2010-06-02T09:15:27-04:00 — #1
Hi from very hot & sunny 21 degrees C Wakefiled UK...
Ive got a situation where i have a graphic sitting in a line of text which looks awkward.
Ive made a bit of progress before posting. Originally i just added the text and it broke all the text flow up. Then I remebered that I needed to get the image inline so placed the img element insine a span class with a bit of inline css, which of course I'll add to an external style sheet later.
Any way heres the specific problem. On this page http://www.pauserefreshment.co.uk/la-spaziale-s5-manual.html there a plus graphic, if you cant find it Ive put it in the screen grab at the top of this post.
I want to make the graphic sit evenly instead of what I have now which is an ugly line height change in the paragraph. Is the best solution to increase the
Any insights welcome
stevie_d — 2010-06-02T18:42:21-04:00 — #2
Why do you even need the span? Just whack those styles onto the <img> tag and you should get the same result!
stomme_poes — 2010-06-02T15:44:43-04:00 — #3
This is kinda old but take a look at this. It's pretty cool and may help you "see" better what's going on with stuff like vertical-align, line-height and font-size.
ryanreese — 2010-06-02T17:39:42-04:00 — #4
Your thinking was correct David :). That was my thinking as well when I posted lol
zygoma — 2010-06-02T11:22:33-04:00 — #5
Nice one Ryan you fixed it and heres the code I put in to get the image to sit tight within a line of text -
<span style="vertical-align:bottom; display:inline-block"><img src="images/model_bean/plus_25.jpg" alt="plus key on La Spaziale s5" width="25" height="25" /></span>
Thinking about it before this fix it was sitting on the baseline of the text by default and vertical-align:bottom gets it lower than the baseline. If my thinking is wrong any insights welcome
ryanreese — 2010-06-02T09:31:04-04:00 — #6
Hmm, on hte <span> which you set display:inline-block, can you not just set the vertical-align to bottom?
zygoma — 2010-06-03T05:13:48-04:00 — #7
Thank you everyone again - Ive applied your solutions and now know how to get a graphic to sit tight in a line of text
zygoma — 2010-06-02T15:58:25-04:00 — #8
Brilliant Stomme thanks