@ mustermann
The CSS is being “Autoptimized” so it is impossible to know where the CSS conflict is occurring. Something is changing the left padding. My best guess is the theme. Seems like is is messing up PageNavi too. Seeing as the alignment is all messed up. Add the following to the theme’s custom CSS area:
#cn-page-nav .page-numbers,
#cn-page-nav a {
padding: 3px 6px !important;
}
That will fix up the display.
You can style the Connections to better match the style being applied to PageNavi with this CSS:
#cn-page-nav .page-numbers.current,
#cn-page-nav .page-numbers.dots,
#cn-page-nav .disabled {
color: #fff !important;
}
#cn-page-nav .page-numbers.current {
margin: 0 3px 5px;
padding: 6px 8px;
background: #1050a3;
border: 1px solid #1050a3;
-webkit-border-radius: 2px;
-webkit-border-radius: 2px;
border-radius: 2px;
color: #fff;
}
#cn-page-nav .page-numbers {
margin: 0;
padding: 10px 0 10px 110px;
overflow: hidden;
color: #666;
font-weight: bold;
}
#cn-page-nav .page-numbers,
#cn-page-nav a {
margin: 0 3px 6px;
padding: 6px 8px !important;
display: inline-block;
background: #f7f7f7;
border: 1px solid #e5e5e5;
-webkit-border-radius: 2px;
border-radius: 2px;
color: #666;
-webkit-transition: all .15s ease-in-out;
-moz-transition: all .15s ease-in-out;
-o-transition: all .15s ease-in-out;
transition: all .15s ease-in-out;
}
#cn-page-nav a.page-numbers:hover {
background: #090;
border: 1px solid #bfbfbf;
color: #fff !important;
text-decoration: none;
}
This is all simply copy/pasted from the style being applied to PageNavi with the selectors changed to target the Connections pagination.
Hope that helps!