1
torweb
Word wrap and image
  • 2007/3/7 18:14

  • torweb

  • Just popping in

  • Posts: 56

  • Since: 2007/3/5 1


Hi...

Trying to get word wrap around images to look nice. Now the text is up against image (left side). I'm trying to put some space between the image and text body and also have text wrap around images. I'm currently using AMS Module phpkaox theme....

Thanks in advance....

2
JMorris
Re: Word wrap and image
  • 2007/3/7 19:29

  • JMorris

  • XOOPS is my life!

  • Posts: 2722

  • Since: 2004/4/11


If AMS will allow HTML in your posts, you can use the following

Left aligned images:
<div style="margin:4px; float:left;"><img src="http://yoursite.com/image.jpg" alt="" /></div>


Right aligned images:
<div style="margin:4px; float:right;"><img src="http://yoursite.com/image.jpg" alt="" /></div>



HTH.

James
Insanity can be defined as "doing the same thing over and over and expecting different results."

Stupidity is not a crime. Therefore, you are free to go.

3
torweb
Re: Word wrap and image
  • 2007/3/7 19:43

  • torweb

  • Just popping in

  • Posts: 56

  • Since: 2007/3/5 1


Unfortunately I don't think I can use html in that module. I was hoping there was some way with the style sheet (CSS)for that theme...

Thanks for the reply.

Tom

4
JMorris
Re: Word wrap and image
  • 2007/3/7 19:51

  • JMorris

  • XOOPS is my life!

  • Posts: 2722

  • Since: 2004/4/11


There is a way in the stylesheet, but you will have to find out what class AMS uses for the article body.

Example:

If AMS uses something like .itemtext for the article body, add the following to your stylesheet...

.itemtext img {margin:4pxfloat:left;}


Keep in mind though that this will affect every module that uses the same class.

HTH.

James
Insanity can be defined as "doing the same thing over and over and expecting different results."

Stupidity is not a crime. Therefore, you are free to go.

5
torweb
Re: Word wrap and image
  • 2007/3/8 15:59

  • torweb

  • Just popping in

  • Posts: 56

  • Since: 2007/3/5 1


I went to the stylesheet for the theme I was using and modified this "img" to include margin, margin-bottom and float:left. This seemed to solve the problem of text against the image without any space.

img { border: 0; margin:6px; margin-bottom:4px; float:left;}

6
JMorris
Re: Word wrap and image
  • 2007/3/8 16:26

  • JMorris

  • XOOPS is my life!

  • Posts: 2722

  • Since: 2004/4/11


Your CSS needs a little tweaking. margin is the shortcut for margin-top, margin-right, margin-bottom, and margin-left.

Like so -> margin: 0 6px 4px 0;

The above will give a margin of 6px to the right, 4px on the bottom and 0px on the top and left.

Also, by defining only img {}, every HTML tag <img will be effected by this CSS.

You need to find the class that AMS is using for the article body and add your CSS with that class as the qualifier. You can check your module templates to find the class.

You should have something like this when you are done.

.itemtext img {margin: 0 6px 4px 0; float:left;}

The .itemtext part is just an example. Replace that with whatever AMS uses for the article body class.

Having your URL would help too.
Insanity can be defined as "doing the same thing over and over and expecting different results."

Stupidity is not a crime. Therefore, you are free to go.

Login

Who's Online

106 user(s) are online (66 user(s) are browsing Support Forums)


Members: 0


Guests: 106


more...

Donat-O-Meter

Stats
Goal: $100.00
Due Date: Apr 30
Gross Amount: $0.00
Net Balance: $0.00
Left to go: $100.00
Make donations with PayPal!

Latest GitHub Commits