WordPress Website Tutorials for Beginners

How to handle this very annoying jumping up and down text next and in between pictures.
How to put text under pictures without using HTML codes.

What we are going to do here is add a transparent “spacebar”

Put Text Under Pictures

 

I am quite in love with pixlr.com so that’s the first move we are going to make.

Pixlr.com

 

On pixlr you launch the web app.

pixlr.com

Sorry, my Pixlr is in Dutch, but you have to create a new image.

pixlr.com

Fill in the data: Name: Spacebar; width 720; height 30; check box before transparent.

pixlr.com

That’s it! Save as PNG (transparent, highest quality).

Upload the transparent “spacebar” and fill in the next settings.

settings for spacebar

spacebar

Transparent spacebar 

For visual disabled

you can add a caption in code, oké a little code then 😉

How do you do that? I show you here:

Go with your cursor over the next space Transparent spacebar and see what is happening.

Select the title “Transparent spacebar” and click on the Capital A, then custom ..  and fill in the background color from your website. Then go to the text editor and cut the code you’ve just created.

The background color of my website is #f4f4f4

<span style=”color: #f4f4f4;”>Transparent spacebar</span>

visual disabled picture

Add the spacebar in full size to the place between the picture and the jumping around text.

Sometimes social media icons can be dreadful annoying, in that case, add the spacebar at the bottom of your post to keep them under control.

And here you see the result of me adding this transparent picture.

Result space bar7

It’s an invisible but very effective solution

to put text under pictures without using HTML codes.

I hope I have solved a very annoying problem for you 🙂

visit my profile page

affiliate disclosure

(Visited 78 times, 1 visits today)

Leave a Reply

Your email address will not be published. Required fields are marked *

You may use these HTML tags and attributes:

<a href="" title=""> <abbr title=""> <acronym title=""> <b> <blockquote cite=""> <cite> <code> <del datetime=""> <em> <i> <q cite=""> <s> <strike> <strong>