Positioning Images and Javascript in Blog Posts

I wrote HTML before they really made any good editors for it, back in the old days of 64 colors or however many there were back then. Tables were the only option. You could place something anywhere you wanted to in a page as long as it was in the center, on the right or on the left. And fonts. Forget fonts. A manual typewriter had better fonts.

But that didn't mean that I didn't balk and whine once CSS became the new thing. It took me a while. CSS can be a weird animal at times. And just as soon as you think you have created the perfect layout, you get an email saying that people can't even read your site on IE7. Floats and positioning still throw me for a loop.

So as far as coming up with a new blog design goes, I don't have the patience much any more. But I do keep a few CSS tips in my head for use in post.

Easy CSS

I didn't learn this until about a year ago and it's a life saver at times. About the easiest way to add an extra bit of style to an object like a picture or post level ad is not by editing the stylesheet. If you are going to use the object in only one post, it doesn't make much sense anyway. It's extra lines for a browser to process every time it loads a page even though it will only be used in one post.

Just wrap the object in a div. In other words, put <div style=""> before the object and </div> after the object.

Floating Blocks

One of the first things I learned was floats. This was something you couldn't do with tables and one I am constantly using. The picture on the right has this tag before it: <div style="float: right"> and the ending </div> after it. By changing the right to left, it will float to the other side of this post.

You can also use "align=right" in the beginning image tag to do the same thing. But the first method can be used for a multitude of objects in a post.

Javascript

This can be a pain in the ass at times. I have found a few quick ways around it. One is a plugin that allows you to paste javascript into a post. Another is using a desktop blogging program like Windows Live Writer that allows you to paste it in.

If the bit of javascript is going to be use more often than one post, another solution is using Adsense Manager, pasting the javascript in as a new ad using the "save as code" function that allows you to save any text as an ad. Now you have a tag that you can paste anywhere in any post to show the javascript or you can add to each post, if needed.

A lot of blogging tools like Live Writer will add images or other objects and style them for you, but sometimes it's easier to open a browser window and write a post. I use Darkroom, Windows Live Writer, ScribeFire and the Wordpress posting page. It just depends on the post and my mood. And these are a couple of the simpler tricks I picked up for doing things the old school way.