...

View Full Version : Margin Problem



MasterRenny
01-29-2012, 06:29 PM
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
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? :( :confused:

coothead
01-29-2012, 07:05 PM
Hi there MasterRenny,

in your style.css file, try adding the two highlighted attributes...

#pagnavi { padding:0px; overflow:auto; width:378px;margin:auto;}
coothead

MasterRenny
01-29-2012, 07:15 PM
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

nameno
01-29-2012, 07:35 PM
try this ..i used it succesfully once

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

MasterRenny
01-29-2012, 07:58 PM
try this ..i used it succesfully once

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

thats just confusing :S

nameno
01-29-2012, 08:08 PM
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;
}

coothead
01-29-2012, 08:11 PM
Hi there MasterRenny,

that's just confusing
But it does give you the solution. ;)

So try replacing this...


#pagnavi { padding:0px; overflow:auto;}

...with this...


#pagnavi {
overflow:hidden;
}
#pagnavi ul {
position:relative;
float:left;
left:50%;
padding:0;
overflow:visible;
}
#pagnavi li {
position:relative;
float:left;
right:50%;
}

coothead



EZ Archive Ads Plugin for vBulletin Copyright 2006 Computer Help Forum