WordPress.org

Ready to get started?Download WordPress

Forums

[resolved] CSS Formatting (14 posts)

  1. dhanken
    Member
    Posted 1 year ago #

    Hello,

    I'm trying to do some formatting but have been unsuccessful thus far. I am trying to get the "Free Website Audit & Report" image to be closer to the text to the left of it, still keeping the whole thing centered, but I am not sure how to go about doing it.

    Does anyone have any suggestions?

    Website is http://www.webrevmarketing.com

    Thank you!

  2. esmi
    Forum Moderator
    Posted 1 year ago #

    Try using Firefox with the Firebug add-on for this kind of CSS work.
    http://getfirebug.com/

  3. dhanken
    Member
    Posted 1 year ago #

    Hello,

    Thanks for the response. I did that, but I am still unable to figure out what I need to do...

  4. Tom Combs
    Member
    Posted 1 year ago #

    The image has both position:absolute & float:right; properties.
    An element can't have both attributes.

    If it has to be position:absolute; , then reduce the left: number.

    If it has to float right, give a margin-right:30px; and see if that helps.
    (adjust the number of pixels as needed).

  5. dhanken
    Member
    Posted 1 year ago #

    Hi Tom,

    I removed the position: absolute, and added a margin-right, but the problem is it moves everything to the left (including the text), instead of just moving the image closer to the text...

    Do you have any other suggestions?...

    Thanks so much!

    Danielle

  6. WPyogi
    Volunteer Moderator
    Posted 1 year ago #

    You have many mark-up errors that may be contributing to problems:

    http://validator.w3.org/check?uri=http%3A%2F%2Fwww.webrevmarketing.com%2F&charset=%28detect+automatically%29&doctype=Inline&group=0

    Since that's a commercial theme, you should be asking the vendor for help.

  7. WPyogi
    Volunteer Moderator
    Posted 1 year ago #

    You should also not be using <center> -- it been deprecated for some time.

  8. Tom Combs
    Member
    Posted 1 year ago #

    Hi Danielle,

    It looks like you are using a text widget with the box checked to automatically add paragraphs.

    You should uncheck the box to automatically add paragraphs and try this code:

    <img style="float:right;margin-right:20px;" src="http://www.webrevmarketing.com/wp-content/uploads/2012/10/email-opt-in-book-e1351098608776.png"/>
    <div align="center">
    <span style="font-family: SansationBold; font-size:19px; color:#666;">Join The Online Revolution Now & Get Your<span style="color:#de5817;border-bottom:1px dashed #de5817;"> FREE (15+ PAGE) WEBSITE AUDIT!</span></span>
    </div>
    <div align="center">
    <span style="font-family: SansationBold; font-size:16px; color:#666;">Uncover the Hidden Tips & Tricks to Drive Massive Traffic, Leads & Sales.</span>
    </div>
    <div align="center">
    <form method="post" action="http://www.aweber.com/scripts/addlead.pl">
    <input type="hidden" name="listname" value="webrev_website" />
    <input type="hidden" name="redirect" value="http://www.webrevmarketing.com/thank-you/" />
    <input type="hidden" name="meta_adtracking" value="custom form" />
    <input type="hidden" name="meta_message" value="1" />
    <input type="hidden" name="meta_required" value="name,email" />
    <span style="font-family: SansationBold; font-size:19px; color:#666;">Name: <input type="text" name="name" value="" size="25"> Email: <input type="text" name="from" value="" size="25"> <input type="submit" name="submit" value="JOIN NOW!" size="15"></span></form>
    </div>

    You should also note that using inline styles in text widgets (or anywhere in your code), is bad for SEO.

    Let me know if that works.

  9. Tom Combs
    Member
    Posted 1 year ago #

    Danielle,

    WPyogi is right, notice I used <div align="center"> , which really isn't any better than <center> ....you should control the styling with your CSS.

    :-)

  10. dhanken
    Member
    Posted 1 year ago #

    Thank you for your suggestions and input. Tom, the code provided didn't seem to make a difference. I will take a different approach and mess with it more by removing the center div and styles in the text widget and moving them into style.css.

    As for the validation errors. I will see what I can fix.

    Thanks so much!

    Danielle

  11. Tom Combs
    Member
    Posted 1 year ago #

    Hi Danielle,

    You said margin-right moved everything to the left.

    Try this:

    margin:0px 20px 0px -20px;

    that will give it a right margin of 20px and left margin of -20px, meaning it should keep the text right where it is.

  12. dhanken
    Member
    Posted 1 year ago #

    That did it Tom! Good thinking! Thank you so much for your help!!!

  13. Tom Combs
    Member
    Posted 1 year ago #

    Anytime, Glad you it worked out for you!

    If you could mark this thread as "Solved", that would be great.
    (it's in the sidebar on the right) :-)

  14. dhanken
    Member
    Posted 1 year ago #

    Thanks again, and you got it!

Topic Closed

This topic has been closed to new replies.

About this Topic

Tags

No tags yet.