Contact Form appearance issues

  • Unknown's avatar
    inkubatorstorylab · Member ·

    The contact form on my website breaks up when I add a photo to the page, I think it’s wrapping weird, but the photo I used is large enough that it shouldn’t have to wrap. The page in question is http://www.fightingchanceseattle.com/register-online (I took the photo down for now until I can figure out how to get it to display properly).
    Blog url: http://fightingchanceseattle.wordpress.com/

    The blog I need help with is: (visible only to logged in users)

  • Unknown's avatar
    chrisrudzki · Member ·

    Howdy,

    Could you try adding the photo back to the page, and ensure it’s properly aligned?

    Align Images With Text

    If the image isn’t appearing as you like, please keep it as is, and give me a few more details about how you want it to appear.

    I’ll be happy to take a look. :-)

  • Unknown's avatar
    inkubatorstorylab · Member ·

    Hi Chris,

    Thanks for your help. I have a bunch of advertisements running in the next few days on Yelp that are pushing people to that Register Online page, so I made a test page to show you what is going wrong, hope this is ok. Everything is exactly the same and I’m getting the same results:

    http://fightingchanceseattle.com/test-form/

    So, first off, the image I am using has a white border on the bottom, I did that to prevent text from wrapping under the image on previous pages on the site. I have limited html skills and this was a quick (if ugly) hack that made the rest of the site work.

    As you can see, what happens is the web form breaks in the middle of the radio buttons and scoots to the bottom of the page, underneath the photo. This seems to happen no matter what size the photo is (I’ve tried resizing from super small to large). I have also noticed that when I use any of the headline tags (even small ones like “h3”) I get a similar effect when the text I put the headline tag on is wrapped around a photo, the whole text piece breaks up and lines up UNDER the photo.

    Any help or advice is greatly appreciated. Let me know if you have further questions.

    Thanks!
    Jordan

  • staff-blorbo · Staff ·

    That is sadly kind of a common issue with text wrapping. Text will always be wrapped relative to its surroundings, like the image.

    If you give the image no alignment or center alignment, with the form below or above it, it should work out better.

  • Unknown's avatar
    chrisrudzki · Member ·

    One thing you could do is keep the image aligned as it is, go to the HTML tab in your editor, and use the following code:

    <div style="width:300px;float:right;">
[Your contact form here]
</div>
  • Unknown's avatar
    inkubatorstorylab · Member ·

    Bam!

    http://fightingchanceseattle.com/register-online/

    Thanks! This is what I was trying to achieve :)

  • The topic ‘Contact Form appearance issues’ is closed to new replies.