1. This site uses cookies. By continuing to use this site, you are agreeing to our use of cookies. Learn More.

thread index css

Discussion in 'Styling and Customization Questions' started by Trover, Feb 14, 2012.

  1. Trover

    Trover Member

    So I'm trying to add some padding to the thread index to the right of the individual posts. How would I go about doing this?
     
  2. steel_curtain

    steel_curtain Well-Known Member

    Can you post a screenshot or provide a link?
     
  3. Trover

    Trover Member

    Yeah sure, look at the main page of my site http://epoint.me/. I'm trying to add some padding to the right of replies/views etc.
     
  4. steel_curtain

    steel_curtain Well-Known Member

    Try adding this to extra.css adjust padding to your liking.

    Code:
    .discussionList .statsLast {
    padding-right: 10px;
    }
     
    Trover likes this.
  5. Trover

    Trover Member

    Thanks! I was trying to edit it directly in the template and for some reason that wasn't working.
     
  6. Trover

    Trover Member

    I have another question, would you know how to keep it always x pixels away from the sidebar?
     
  7. Brogan

    Brogan XenForo Moderator Staff Member

    Try this.

    Code:
    margin-right: {xen:calc '@sidebar.width + 10'}px;
    Actually, that may not work if it's inside the main content div (I haven't checked your site).
     
    Trover likes this.
  8. Trover

    Trover Member

    Yeah brogan it is.
     
  9. steel_curtain

    steel_curtain Well-Known Member

    It can be positioned that way, but depends how you want to achieve that. The stats area you're adding padding to sits inside the mainContent div, which has a right margin of 260 px from the right side of the main container. So, say you want to move it to the left X pixels you increase the right margin, or decrease if you want to move it closer.
     
  10. Trover

    Trover Member

    Code:
    .mainContent {
    margin-right: 270px;
    }
    
    So I tried with this, and It works to some degree, but what I am really trying to do is prevent overlap when I make the browser screen smaller or use a computer with a lower resolution etc.
     
  11. steel_curtain

    steel_curtain Well-Known Member

    You have some odd settings with your margins and what have you, but adding this to extra.css should achieve the desired effect. Tested in chrome and firefox.

    Code:
    .sidebar {
        margin-left: -25px !important;
    }
     
    Trover likes this.
  12. Trover

    Trover Member

    Thanks for the help! It's still a little bit weird, but it fixed the overlap!
     

Share This Page