How to customise <br> size in Text Widget?

  • Author
    Posts
  • #552018

    Hi, I have the following markup in my Text Widget:
    ————————————–
    <div style=”width:200px;height:125px;border:1px dashed #8B7D6B;”>
    <div style=”padding-top:.5em;”><div align=”center”><b>Purchase a copy</b></div></div>

    <div align=”center”>£25.00 + £3.00 shipping</div>

    <div align=”center”><img src=”https://www.paypal.com/en_US/i/btn/btn_xpressCheckout.gif” alt=”Checkout with PayPal” /></div>
    </div>
    ————————————–

    The trouble is the gap between lines is a little too large – I’d prefer about half of that.

    Does anyone know of a way to reduce the size of the
    break?

    Cheers

    The blog I need help with is aboutthemen.wordpress.com.

    #552123

    Sorry, didn’t put my code in quotations. I’m looking to reduce the size of the ‘
    ”s

    #552124

    Hmm, not too on the ball today!

    Ok, last time – reduce the size of the <br />‘s

    #552141

    I’ve cleaned up your code and changed some stuff around. First I used inline CSS in the main parent div to set center alignment for all nested divs. I also changed your bold tags to strong tags since wordpress doctype is XHTML and it likes strong and em tags rather than b and i tags.

    Next I added some top and bottom padding declarations to the div with the price in it and you can adjust those to your liking to get the spacing to the upper and lower divs they way you want it. I used 10px just as placeholders. With divs there is no need to use break tags between them.

    <div style="width:200px;height:125px;border:1px dashed #8B7D6B;text-align:center;">
    <div style="padding-top:.5em;"><div><strong>Purchase a copy</strong></div></div>
    <div style="padding-top:10px;padding-bottom:10px;">£25.00 + £3.00 shipping</div>
    <div><img src="https://www.paypal.com/en_US/i/btn/btn_xpressCheckout.gif" alt="Checkout with PayPal" /></div>
    </div>
    #552142

    One other thing. The secure checkout paypal buttons won’t work here at wordpress.COM since the code that they use is not permitted here for security reasons. The only paypal button allowed here is the standard HTML donation button.

    #552178

    Brilliant! Thanks thesacredpath! I’m going to try out your suggestion above now.

    Hmm, shame about the Paypal – but maybe I can make do with a donation button. Cheers for the heads-up!

    #552179

    You’re welcome and you know where we are if you have further questions.

    #552180

    timethief
    Member

    WordPress.COM free hosted blogs cannot be equipped for ecommerce transactions – no retailing or reselling anything you did not create is allowed. You will have to make do with either a PayPal donation button or a contact form or both as you have no other choices on a free blog from and being free hosted by WordPress.COM
    http://en.support.wordpress.com/paypal/
    http://en.support.wordpress.com/contact-form/
    types of blogs allowed and not allowed > http://wordpress.com/types-of-blogs/

    #552183

    Yeah.. that worked perfectly – thanks! ^_^

    Just out of interest, what problems might occur if I’m using the old HTML markup and not XHTML?

    Just curious because the old tags seemed to work somewhat – at least as far as I could see at my end.

    #552184

    Thanks timethief – how about if I’m the author of the book? Is that allowed?

    #552185

    timethief
    Member

    If you don’t want problems with corrupted HTML creating all kinds of formatting woes, falling sidebars, etc. then be sure that you have enabled this > Settings > Writing
    ___ WordPress should correct invalidly nested XHTML automatically
    “Save Changes”

    #552186

    timethief
    Member

    Yes, you are the creator (author). :) Please read here > http://wordpress.com/types-of-blogs/

    #552187

    timethief
    Member

    If you intend to copy and paste from Microsoft WORD (horrors!) then be sure to follow these instructions. > http://en.support.wordpress.com/microsoft-word/#using-word-cleanly

    #552188

    Thanks timethief – you’re a star!

    I’ve done the Settings -> Writing trick and I think it’s tidied my mess up.

    Glad to see us authors are allowed to hang around here ;-)

    #552189

    timethief
    Member

    You’re welcome and best wishes with your blog. :)

    #552197

    Oh fiddlesticks. I’ve just tried looking at my blog on a mac and it doesn’t like the font: Script MT Bold.

    I was thinking that I could maybe insert an image instead of the title font but I’m having a little trouble identifying it in the CSS.

    Anyone have an idea what I should be looking for? Or is it best if I start another thread for this? I was also hoping to insert a very small image in the footer instead of the script font there too..

    #552199

    Ah! I see you’re already ahead of the game thesacredpath!

    https://en.forums.wordpress.com/topic/replace-site-title-with-image?replies=9#post-535844

    Just a quick question – does this replace my title or just overlay it? I mean to say, once I set up my image should I do some tidying up behind the scenes to remove the original title?

    #552205

    Argh, even more frustrating I can’t for the life of me work out how to reduce the white space between the bottom of the header image (the Script MT Bold title) and the top of the brown navigation bar.

    I’d like to get it so there’s an equal white space above and below the title, if that makes sense.

    #552206

    Browsers will typically render non-XHTML, HTML tags correctly, but since wordpress declares XHTML doctype, it will create validation errors. Generally any tag you use that is going to actually cause a problem (or might not be allowed here for security reasons) will either be stripped out by the wordpress software, or automatically changed, or it just won’t do anything. It is always a good idea to keep validation errors to a minimum since the search engines get cranky if there are too many and can even quit indexing your site because of them.

    One way to keep that from happening is to go to settings > writing and select “WordPress should correct invalidly nested XHTML automatically” and then save. That should correct most errors in posts and pages and keep them from becoming an issue.

    #552207

    Great, thanks thescaredpath – that’s really interesting to know about it affecting the search engines results. Hopefully that trick in the settings > writing has tidied up things a bit. Fingers crossed.

The topic ‘How to customise <br> size in Text Widget?’ is closed to new replies.