Missing Page Numbers from Pagination (floated right)

GregF

Active member
Hi guys,

Hoping someone can help with something other than revert to default templates :)

I've been working on a custom XF theme for a client, and all has gone well, we've just hit some minor issues with the pagination control, we have it floated to the right hand side rather than left as default and have encountered the following issues we can't solve;
  • Missing page numbers from longer paged threads, eg. randomly drops page 8 from a 9 page thread when viewing page 9.
  • Pagination drops down onto 2 lines when using the arrows to cycle through pages, this can be fixed with Firebug, but then applying these changes to the CSS doesn't seem to hold?
Any suggestions would be appreciated!
Thanks, Greg
 
Can you post a URL showing the problem?

Pagination drops down onto 2 lines when using the arrows to cycle through pages, this can be fixed with Firebug, but then applying these changes to the CSS doesn't seem to hold?

That's a good approach (using Firebug). That's why I want the URL. :p
 
Your page number boxes are fat. The problem is the container isn't wide enough, and overflow is hidden. I was able to fix the problem in debug by increasing the width in this CSS:

Admin CP -> Appearance -> Templates -> page_nav.css

Code:
	.PageNav .scrollable
	{
		position: relative;
		overflow: hidden;
		width: {xen:calc '(@pageNavLinkWidth * 5) + (@pageNavLinkSpacing * 4) + (@pageNavLink.border-width * 10)'}px; /* width of 5 page numbers plus their margin & border */
		height: 18px; /* only needs to be approximate */
	}

Obviously this width is calculated. You should work with the variables that are referenced here. Those vars can be changed in your:

Admin CP -> Appearance -> Style Properties -> PageNav, Link Groups and Tabs
 
Thanks Jake! That's solved the missing page number issue :)

Any ideas regarding the pagination dropping onto 2 lines? Occurs in Firefox & Chrome...
The problem is that the browser is setting the div width when rendering it, which when the extra arrow is added in, isn't wide enough, so it wraps whereas when editing it with firebug, the browser will update the width to accomodate the arrow.

Thanks for your help,
Greg
 
Any ideas regarding the pagination dropping onto 2 lines? Occurs in Firefox & Chrome...
The problem is that the browser is setting the div width when rendering it, which when the extra arrow is added in, isn't wide enough, so it wraps whereas when editing it with firebug, the browser will update the width to accomodate the arrow.

I haven't been able to figure that out (short of manually setting a width which is crappy). Will take another look later.
 
Top Bottom