Since working with a cat image seems to be traditional, I thought I’d use one of Stuey for this next exercise in CSS madness. I was trying to get this to work the other night, adapting one of several methods for adding drop shadows in CSS, but doing it “the MT way.” I may have to concede that such things will have to be done “as is” and learn not to rely on the MT “show me the HTML feature.”
Now I’m trying it “by the book” as described at Alistapart.rather than applying the CSS class with class="floatimgleft"
as an attibute of the image the way MT seems to be pushing me to do. I can at least use that style to move the image to the left and get text to wrap successfully, but when I tried to add the drop shadow effect to the same style the other day, I hit the wall. Let’s see how this goes.
Results:
1. D’oh! forgot that MT likes absolute URLs…
2. Whoa! it ate the next post! Hmm. Dammit. Forgot to close a div. Let’s try this, the way MT likes it:
3. The code stylesheet either isn’t working right again, or it’s not wrapped right.
4. Yeesh. I tried to hand code the image in MT before. I forgot that it likes the image size and border set in a particular way. So I re-uploaded just to get the picky way MT wants to do it.
5.okay, try this way of doing it:
div id=”floatimgleft” img alt=”Hey! My Kitty!” src=”http://www.blogula-rasa.com/images/stuey.jpg” width=”288″ height=”177″ border=”0″ />
6. Oh, my God, this is still a mess, and it doesn’t help to chat and listen to the radio at the same time.
7, 8, 9. Lather, rinse, repeat.
10. You know, I could be happy with a grey border and a tiny peep of parchment colored background showing between the image and the frame.
All I have to do is add class=floatimgleft"
to the image attribute. I can live with that.