Hello and welcome to our community! Is this your first visit?
Register
Enjoy an ad free experience by logging in. Not a member yet? Register.
Results 1 to 8 of 8

Thread: Padding text

  1. #1
    USB
    USB is offline
    New Coder
    Join Date
    Jan 2012
    Posts
    29
    Thanks
    5
    Thanked 0 Times in 0 Posts

    Padding text

    Hi, I've been trying to get this text down abit but it keeps its position like that.
    I tried padding-top, and margin-top but nothing seems to work... what am I doing wrong? (I'm using bootstrap)


    HTML
    PHP Code:
    <div id="side-panel">
     <
    ul>
         <
    li>
        <
    div class="essential-links"></div>
         <
    ul>
              <
    li class="light"><a href="">I want this text down abit</a></li>
              <
    li class="dark"><a href="">I want this text down abit</a></li>
              <
    li class="light"><a href="">I want this text down abit</a></li>
              <
    li class="dark"><a href="">I want this text down abit</a></li>
            </
    ul>
          </
    li>
     </
    ul>
    </
    div
    CSS
    PHP Code:
    #side-panel > ul > li > ul > li.light {
        
    width289px;
        
    height40px;
        
    background-imageurl("../images/light.png");
        
    background-repeatrepeat;
        
    border-left1px solid #000;
        
    border-right1px solid #000;
    }

    #side-panel > ul > li > ul > li.dark {
        
    width289px;
        
    height40px;
        
    background-imageurl("../images/dark.png");
        
    background-repeatrepeat;
        
    border-left1px solid #000;
        
    border-right1px solid #000;
    }

    #side-panel > ul > li > ul > li > a {
        
    font-familyArialHelveticasans-serif;
        
    font-size12px;
        
    font-weightbold;
        
    color#818b98;
        
    padding-left40px;

    Last edited by USB; 09-22-2013 at 10:10 PM.

  • #2
    Regular Coder LearningCoder's Avatar
    Join Date
    Jan 2011
    Location
    The Pleiades
    Posts
    920
    Thanks
    76
    Thanked 29 Times in 29 Posts
    Good evening,

    Have you got a live link or can you post the CSS for the essential-links div and the unordered list?

    First off you haven't closed out your essential-links div. Why are you using a div within a list-item?

    Kind regards,

    LC.
    Last edited by LearningCoder; 09-22-2013 at 11:09 PM.

  • #3
    Senior Coder
    Join Date
    Sep 2010
    Posts
    1,903
    Thanks
    15
    Thanked 226 Times in 226 Posts
    If you want an element to shift downward on a page you generally apply a margin-top below all the other margin statements.
    Welcome to http://www.myphotowizard.net

    where you can edit images, make a photo calendar, add text to images, and do much more.


    When you know what you're doing it's called Engineering, when you don't know, it's called Research and Development. And you can always charge more for Research and Development.

  • #4
    USB
    USB is offline
    New Coder
    Join Date
    Jan 2012
    Posts
    29
    Thanks
    5
    Thanked 0 Times in 0 Posts
    Here is a live link: http://kanske.net76.net/

  • #5
    Regular Coder
    Join Date
    Mar 2013
    Posts
    262
    Thanks
    4
    Thanked 67 Times in 67 Posts
    Try applying margin to the list, not the anchor.
    My signature :)

  • #6
    USB
    USB is offline
    New Coder
    Join Date
    Jan 2012
    Posts
    29
    Thanks
    5
    Thanked 0 Times in 0 Posts
    Quote Originally Posted by ttkim View Post
    Try applying margin to the list, not the anchor.
    Did not work. It moved the whole list. All I want to move is the achor. Padding-left is working fine but as you can see but padding-top dosn't.

  • #7
    Regular Coder
    Join Date
    Mar 2013
    Posts
    262
    Thanks
    4
    Thanked 67 Times in 67 Posts
    Don't you want to move the whole list down? Both should achieve the same effect unless you want to make the "clickable" range bigger.

    Well anyway, if you want to add padding to the anchor itself, set its display to block.
    My signature :)

  • Users who have thanked ttkim for this post:

    USB (09-23-2013)

  • #8
    USB
    USB is offline
    New Coder
    Join Date
    Jan 2012
    Posts
    29
    Thanks
    5
    Thanked 0 Times in 0 Posts
    Quote Originally Posted by ttkim View Post
    Don't you want to move the whole list down? Both should achieve the same effect unless you want to make the "clickable" range bigger.

    Well anyway, if you want to add padding to the anchor itself, set its display to block.
    Thank you! that worked


  •  

    Posting Permissions

    • You may not post new threads
    • You may not post replies
    • You may not post attachments
    • You may not edit your posts
    •