Message 1416 of 1761

Indenting Lists, Paragraphs, ect. in Messages

Mrs. McCaleb, my high school English teacher, always stressed indenting paragraphs. I forget now what she had us use as an aid to help us indent correctly. It might have been a pencil or a pinky finger.

She would have hated the Eons message box with no way to easily indent. No matter how many times you hit the space bar, the message box editor turns them into one space. Of course, you could use character entities for the spaces, but that doesn't always work and if you leave out one little part of it, then you have part of the code showing.

So, what's a body to do? One solution is to use a 1 x 1 transparent gif. Use code to set the width at 10px, 20px or 30px or whatever you need - and Wah Lah, Mercy Bucket - you can now indent a paragraph, a list, a quote - or whatever you fancy!
Mimi58's profile
test
HonestJohn's profile

over 3 years ago
Here is the HTML image tags you need to use the code. Change the width to the size you want and add the URL to your gif:
<img style="width: 1px; height: 1px;" alt="" src="THE URL OF YOUR SPACER GIF" />

Of course, Eons does things differently.

I uploaded a spacer gif to the Studio photo section which you can use. However, Eons changed the gif to a jpg and added code to change its size when it put it in the group's photo album. It looks like a black box. So, if you upload your own spacer gif or use the one uploaded to the group photos, you will need to be sure and use the image tags and the Direct URL to the actual gif. Change the width. Don't use the embed code or the URL from the embed code. Ahh, the little workarounds to get things to work on Eons!
Mimi58's profile

over 3 years ago
Is there times that you can use & nbsp; ? (remove space between the & and n)
I want spaces right here---->               and I got them!
I need to learn how to add spaces around my images that are wrapped with text. I do not like the text butting up against the image. You can see that happening here. Any ideas? <---------right here!
GaryJames's profile

over 3 years ago
You could use the character entity - & nbsp; without the space - for a space, but then you have to add them for each line of text. There's a few ways you can set a margin for each side of the picture. The first example sets the margin to the right. The other example sets a margin to both sides of the image.

pic You can put the image and text within paragraph tags, then include the picture in a span which includes styling to have a margin to the right of the picture. The picture I'm using is from the Kompozer help file which happened to be handy.

Here's the code that was used:

<p style="width: 450px;"><span style="width: 200px; height: 145px; margin-right: 6px; float: left;"><img style="width: 200px; height: 145px;" alt="pic" src="http://www.eons.com/images/members/ 2008/11/15/5/6/56456762219125518187.jpg" ></span> You could also do it by adding - hspace="8" - within the image tag. However, it puts space on both sides of the image. Here's the code that was used for this view:

<img style="width: 200px; height: 145px; float: left;" alt="" src="YOUR URL" hspace="8">

Sometimes you need to add line breaks if you want the rest of the writing to be below the picture. It's easy to do on your own web page, but Eons eats extra line breaks in posts, so you probably would have to put the last code between p or div tags. I'll try to show that in another reply.

You could also add styling code to choose the font, font color and size, etc. Others may also have some ideas, tips or suggestions.
Mimi58's profile

over 3 years ago
The second code in the reply I gave works better if it is inside a paragraph or div. Here's how to do that:

Here's the first picture with the code and text within paragraph tags.


Then I have some writing that's not by a picture.

Then I have another picture with some text by it


One important thing to remember on Eons is to put all of the code in one long line or the message editor adds line breaks where you don't want them!

Here's the code with that I used for the examples in this reply:

<p style="width: 450px; height: 145px;"><img style="width: 200px; height: 145px; float: left;" alt="" src="http://www.eons.com/images/members/ 2008/11/15/5/6/56456762219125518187.jpg" hspace="8">This is where you put your text. Notice the paragraph is styled with a width and height.</p>

Have Fun!
Mimi58's profile

over 3 years ago

Eons Picks

Visit Eons-Only Specials
For a limited time, get FREE SmartSound Earbuds on purchases of $100+! Use the code “EONSBUDS” at checkout.

Eons Rewards Club
Great shopping deals & savings for Eons Members!

Save on Eons Games
Eons Downloadable Games. Now just $6.99!

Read Member Blogs
Eons has great blogs—read the latest from members or start yours!