Help with HTML widget or JS – looks wrong when published

• 

  andrewyabsley · Member · Mar 17, 2014 at 9:31 pm

  • Copy link
  • Add topic to favorites

  I have this code widget , justpi helped me last time and i appreciated that.

  So,

  I have this widget … as they refer to it – or JS I am not sure – it is on my blog page so it can be seen on “test widget” page.

  It is placing the text down & to the right of the bottom of the BOOK COVER , when I t SHOULD be placed right neXt to the image. Can someone possibly help me with this. I should be able to figure it out after having a little experience with the last widget , but this is quite different and help would be great !

  Andrew

  here is the code :

  —————————————————————————
  <div id=”goodreadsGiveawayWidget84414″>

  <!– Show static html as a placeholder in case js is not enabled –>

  .goodreadsGiveawayWidget { color: #555; font-family: georgia, serif; font-weight: normal; text-align: left; font-size: 14px; font-style: normal; background: white; } .goodreadsGiveawayWidget img { padding: 0 !important; margin: 0 !important; } .goodreadsGiveawayWidget a { padding: 0 !important; margin: 0; color: #660; text-decoration: none; } .goodreadsGiveawayWidget a:visted { color: #660; text-decoration: none; } .goodreadsGiveawayWidget a:hover { color: #660; text-decoration: underline !important; } .goodreadsGiveawayWidget p { margin: 0 0 .5em !important; padding: 0; } .goodreadsGiveawayWidgetEnterLink { display: block; width: 150px; margin: 10px auto 0 !important; padding: 0px 5px !important; text-align: center; line-height: 1.8em; color: #222; font-size: 14px; font-weight: bold; border: 1px solid #6A6454; border-radius: 5px; font-family:arial,verdana,helvetica,sans-serif; background-image:url(https://www.goodreads.com/images/layout/gr_button4.gif); background-repeat: repeat-x; background-color:#BBB596; outline: 0; white-space: nowrap; } .goodreadsGiveawayWidgetEnterLink:hover { background-image:url(https://www.goodreads.com/images/layout/gr_button4_hover.gif); color: black; text-decoration: none; cursor: pointer; }
  –></style>

  Goodreads Book Giveaway</h2>
  <div style=”float: left;”><img title=”The Truth About De Campo by Jennifer  Hayward” alt=”The Truth About De Campo by Jennifer  Hayward” src=”https://d202m5krfqbpi5.cloudfront.net/books/1389588552l/18812537.jpg” width=”100″ /></div>
  <div style=”margin: 0 0 0 110px !important; padding: 0 0 0 0 !important;”>
  <h3 style=”margin: 0; padding: 0; font-size: 16px; line-height: 20px; font-weight: normal; font-style: normal;”>The Truth About De Campo</h3>
  <h4 style=”margin: 0 0 10px; padding: 0; font-style: normal; font-weight: normal;”>by Jennifer Hayward</h4>
  <div class=”giveaway_details”>

  Giveaway ends March 30, 2014.

  See the giveaway details
  at Goodreads.

  </div>
  </div>
  <div style=”clear: both;”></div>
  Enter to win

  </div>
  </div>

  ——————————————————————————-

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