just need to center align a div

  • Andy

    (@andythreecoaching)


    10 years, 2 months ago

    If you go here.

    You’ll see a galleries page and I’m trying to get the top gallery to align to center. Once that’s done I’ll apply it to the rest.

    You’ll even see that I’ve managed this just fine with the others, but I’ve tried all of my center-align tricks and none of them work.

    Thanks in advance ??

Viewing 2 replies - 1 through 2 (of 2 total)

  • You have to set a fixed width for the gallery container that is equal to the combined width of how many thumbnails you want to display across.
    Using easy math:

    thumbnails are 100 x 100
    margin is 10px on each making them 120px wide each
    show six thumbnails across = width:720px

    note these are not your dimensions but using firebug I was able to get yours looking pretty good using a width of 720px – it showed 5 across at that width.

    Here is the CSS I used:

    .ngg-galleryoverview {
overflow: hidden;
width: 720px;
clear: both;
display: block !important;
margin: 0 auto;
}

    This CSS can be found in this file:
    https://www.stayinwonderland.com/wp-content/plugins/nextgen-gallery/products/photocrati_nextgen/modules/nextgen_basic_gallery/static/thumbnails/nextgen_basic_thumbnails.css?ver=3.8.4

    Since your theme CSS is above wp_head() it loads the nextgen css afterward so you should put it there instead of in your theme’s CSS where it will be overridden by nextgen styles. Or ideally, move your stylesheet so it is enqueued after nextgen’s so yours can override the plugin styles.

    Thread Starter Andy

    (@andythreecoaching)

    Thanks for getting back to me.

    Well, I was hoping for an easy, local fix to the div as I’m just a copy and paste monkey and don’t want to complicate things (I know this may seem fairly straightforward to most).

    I only edit once a year and don’t want to get lost next time I come to tweak it.

    So for now I’ve sort of cheated it by padding a div out from the left. Not ideal.

    Cheers though ??

Viewing 2 replies - 1 through 2 (of 2 total)
  • The topic ‘just need to center align a div’ is closed to new replies.