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 7 of 7

Thread: Margin Problem

  1. #1
    New Coder
    Join Date
    Oct 2011
    Posts
    16
    Thanks
    4
    Thanked 0 Times in 0 Posts

    Margin Problem

    how is it possible for me to remove this margin and centre my paging navigation

    www.masterrenny.com < at the bottom

    this is the problem: http://i.imgur.com/iscw7.png

    ive tried a simple
    Code:
    ul, menu, dir { display: block; list-style-type: disc; -webkit-margin-before: 0em; -webkit-margin-after: 0em; -webkit-margin-start: 0px; -webkit-margin-end: 0px; -webkit-padding-start: 0px; }
    but that removes it for the whole style which isnt summa i want

    any ideas?

  • #2
    Senior Coder coothead's Avatar
    Join Date
    Jan 2004
    Location
    chertsey, a small town 25 miles south west of london, england.
    Posts
    1,707
    Thanks
    0
    Thanked 237 Times in 232 Posts
    Hi there MasterRenny,

    in your style.css file, try adding the two highlighted attributes...
    Code:
    #pagnavi { padding:0px; overflow:auto; width:378px;margin:auto;}
    coothead

  • Users who have thanked coothead for this post:

    MasterRenny (01-29-2012)

  • #3
    New Coder
    Join Date
    Oct 2011
    Posts
    16
    Thanks
    4
    Thanked 0 Times in 0 Posts
    problem is its not always that size, if you click on the numbers links like next and previous links appear and width:auto dont do nothing

  • #4
    New Coder
    Join Date
    Jan 2012
    Location
    Romania
    Posts
    10
    Thanks
    0
    Thanked 0 Times in 0 Posts
    try this ..i used it succesfully once

    http://www.cssplay.co.uk/menus/centered.html

  • #5
    New Coder
    Join Date
    Oct 2011
    Posts
    16
    Thanks
    4
    Thanked 0 Times in 0 Posts
    Quote Originally Posted by nameno View Post
    try this ..i used it succesfully once

    http://www.cssplay.co.uk/menus/centered.html
    thats just confusing :S

  • #6
    New Coder
    Join Date
    Jan 2012
    Location
    Romania
    Posts
    10
    Thanks
    0
    Thanked 0 Times in 0 Posts
    OK try this


    <div id="pagnavi">
    <div style="width: 100%; overflow:hidden;">
    <ul class="ModernStylePaginationROUNDED MSPR_light">
    <li class="current">1</li>
    <li><a href='http://www.masterrenny.com/page/2/' class="current">2</a></li>
    <li><a href='http://www.masterrenny.com/page/3/' class="current">3</a></li>
    <li><a href='http://www.masterrenny.com/page/4/' class="current">4</a></li>
    <li><a href="http://www.masterrenny.com/page/2/">Next &rsaquo;</a></li>
    <li><a href='http://www.masterrenny.com/page/12/'>Last &raquo;</a></li>
    </ul>
    </div>
    </div>


    /* SLIGHTLY ROUNDED CORNERS */
    .ModernStylePaginationROUNDED {
    overflow: hidden;
    }
    .ModernStylePaginationROUNDED ul{
    float: left;
    position: relative;
    left: 50%;

    }
    .ModernStylePaginationROUNDED li,.ModernStylePaginationROUNDED_ITEM {
    float: left;
    right: -25%;
    position:relative;
    margin: 5px;
    padding: 7px 10px;
    font-weight: bold;
    font-size: 12px;
    cursor: pointer;
    text-transform: uppercase;

    -webkit-border-radius: 3px;
    -moz-border-radius: 3px;
    border-radius: 3px;
    line-height: 13px;
    }

  • #7
    Senior Coder coothead's Avatar
    Join Date
    Jan 2004
    Location
    chertsey, a small town 25 miles south west of london, england.
    Posts
    1,707
    Thanks
    0
    Thanked 237 Times in 232 Posts
    Hi there MasterRenny,
    that's just confusing
    But it does give you the solution.

    So try replacing this...
    Code:
    
    #pagnavi { padding:0px; overflow:auto;}
    
    ...with this...
    Code:
    
    #pagnavi {
        overflow:hidden;
     }
    #pagnavi ul {
        position:relative;
        float:left;
        left:50%;
        padding:0;
        overflow:visible;
     }
    #pagnavi li {
        position:relative;
        float:left;
        right:50%;
     }
    
    coothead


  •  

    Posting Permissions

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