Results 1 to 3 of 3

Thread: Making text surround an image

  1. #1
    Join Date
    Jul 2007
    Location
    California
    Posts
    177
    Thanks
    2
    Thanked 0 Times in 0 Posts

    Default Making text surround an image

    I've been fooling around with this, and so far have had no luck. I can get text to sit nicely to the left, right, or top of an image...but here is what I would like to know how to do, if possible.

    Many of my articles are bland looking, and I was thinking about placing an image or two right inside of the larger paragraphs, or in between them. Essentially like you often see in news articles. I would like the text to flow around the image and just continue on.

    I'm able to do this by just throwing in a <span> and the line will be on the left and right of the image, but then the next line drops below the image.

    The only way I can think of doing this is by placing 10X1 white invisible images inside the text to create the open section I want, then absolute position the image inside this text. This will work, but will take time, and may not look good in all browsers.

    Any ideas please?

    Thanks!

  2. #2
    Join Date
    Feb 2007
    Posts
    293
    Thanks
    0
    Thanked 0 Times in 0 Posts

    Default

    In css, float can push an image to one side or another, with the text of a paragraph wrapping around it. You can then use margin and padding to add space around your image so the text isn't right on top of it.

    Code:
    <style>
    .picture_left {
    float:left;
    margin:2px;
    }
    .picture_right {
    float:right;
    margin:4px;
    }
    </style>
    
    
    <div>
    <img src="open.gif" class="picture_right">
    your text here your text here your text here your text here your text here your text here your text here your text here your text here your text here your text here your text here your text here your text here 
    <p>
    <img src="open.gif" class="picture_left">your text here your text here your text here your text here your text here your text here your text here your text here your text here your text here your text here your text here your text here your text here 
    
    </div>

  3. #3
    Join Date
    Jul 2007
    Location
    California
    Posts
    177
    Thanks
    2
    Thanked 0 Times in 0 Posts

    Default

    Gah float... I've seen it used, but I've never applied it myself. Other than cut and paste scripts.

    Thanks for the solution... now I can pretty up my pages Just in time too... I started my new give usefull information forum marketing theory. I'm joining forums to help people with financing questions, and hoping they try and hunt me down through my profile home page.

    Staying away from the blatant advertising, cause that's just tacky.

    Everyone here has helped so much... now I just hope I can make some money from this venture!!! Spam tastes bleh, so I better make something soon

Bookmarks

Posting Permissions

  • You may not post new threads
  • You may not post replies
  • You may not post attachments
  • You may not edit your posts
  •