Simple 'padding' question

Discussion in 'HTML & Website Design' started by jg123, May 24, 2007.

  1. #1
    On my blog TopSportsRumors.com I want to add a little space in the right margin on the sidebar item "Play", the red text that is there. What code do I place there to do that?

    thanks in advance for anyone that can help
     
    jg123, May 24, 2007 IP
  2. Katy

    Katy Moderator Staff

    Messages:
    3,490
    Likes Received:
    513
    Best Answers:
    7
    Trophy Points:
    355
    #2
    #redtext {
    padding-right: 3px;}

    <div id="redtext">

    Relax between the games and play the most popular online casino games at 888.com. Learn the rules and try out your skills for free or real money on games like blackjack, craps, Texas Holdem, Omaha Hi, and many more!

    </div>

    Hope this helps! :)

    Kate
     
    Katy, May 24, 2007 IP
    jg123 likes this.
  3. jg123

    jg123 Notable Member

    Messages:
    6,006
    Likes Received:
    387
    Best Answers:
    0
    Trophy Points:
    295
    #3
    That does not seem to be working, here is the exact code that is there now.

    <div class="widget_style">
    <div class="right_bg">
    <div class="right_head"><h2>Play:</h2></div> <ul>

    Relax between the games and play the most popular <a href="http://www.888.com">online casino games</a> at 888.com. Learn the rules and try out your skills for free or real money on games like blackjack, craps, Texas Holdem, Omaha Hi, and many more!
    </ul>
    </div>
     
    jg123, Jun 20, 2007 IP
  4. Katy

    Katy Moderator Staff

    Messages:
    3,490
    Likes Received:
    513
    Best Answers:
    7
    Trophy Points:
    355
    #4
    Your text is between the <ul> tags and you have no right padding for that tag.

    .widget_style ul{
    padding:0px 0px 20px 15px;
    margin:0 0 0 0;
    }

    Try changing the bolded value in the CSS or simply remove the <ul> tags.

    :)
     
    Katy, Jun 20, 2007 IP
  5. Clive

    Clive Web Developer

    Messages:
    4,507
    Likes Received:
    297
    Best Answers:
    0
    Trophy Points:
    250
    #5
    On a side note, <ul> tags should be followed by <li> which are missing in yourcase, and you're also missing a closing </div>.
    This is the corrected code:

    
    <div class="widget_style">
     <div class="right_bg">
      <div class="right_head"><h2>Play:</h2></div>
      <ul>
       [B]<li>[/B]Relax between the games and play the most popular <a href="http://www.888.com">online casino games</a> at 888.com. Learn the rules and try out your skills for free or real money on games like blackjack, craps, Texas Holdem, Omaha Hi, and many more![B]</li>[/B]
      </ul>
     </div>
    [B]</div>[/B]
    
    Code (markup):
     
    Clive, Jun 20, 2007 IP
  6. jg123

    jg123 Notable Member

    Messages:
    6,006
    Likes Received:
    387
    Best Answers:
    0
    Trophy Points:
    295
    #6
    Sorry, the second </div> tag was there I did not include it. I don't really want to change anything for the whole blog because everything sort of works now, it is just that one extra spot I added that I want to change.

    The <li> added a little image infront of it that does not work for that spot.

    Taking away the <ul> makes it go to far to the left side.

    Ok! Changed that to a 3 and it looks great!! Already gave you rep katy and thanks a lot, if you want please submit one of your sites to my PR5 directory WRdir.com and cancel at Paypal and I will approve it.

    .widget_style ul{
    padding:0px 0px 20px 15px;
    margin:0 0 0 0;
    }
     
    jg123, Jun 20, 2007 IP