Ready to get started?Download WordPress


[Plugin: NextGEN Gallery] Space over Gallery (71 posts)

  1. timheckhausen
    Posted 6 years ago #


    Someone has an Idea why i have this large Space between my Gallery an the Headline "Eine kleine Auswahl aus dem Bereich: Print" ?
    Seems that the Gallery starts after the widgets on the right side. But why?

    Thanks for help.

  2. deus62
    Posted 6 years ago #

    I'm not an expert on this at all, but your gallery has the same width as the area that it's in (at least according to the web developer toolbar in Firefox). If you then outline the block level elements (so they are visible) you have a 10px or more margin (on the left) between the main area and the gallery (it "shifts" that amount to the right).

    Soooo, what I would try, just to check, would be to reduce the width of the gallery to 500px or maybe even less to see if it moves up.

    If that is the case, you have some conflicts between some CSS settings, meaning you either need to remove some left margin and/or padding from the gallery or the entry div until everything fits.

    BTW: I don't have the gallery installed yet and just came across your post by chance.

    Hope any of this was helpful and/or understandable.
    Greetings from Germany ... to Germany, btw.

  3. petervanderdoes
    Posted 6 years ago #

    In the CSS file of the gallery there's this section:
    /* ----------- Gallery style -------------*/

    .ngg-galleryoverview {
    overflow: hidden;
    margin-top: 10px;
    width: 100%;
    display:block !important;

    The clear:both makes this class not float. It will display below the section that's the longest, sidebar or main, in this case main.
    If what you intend to do is have the gallery show in main I suggest commenting out the clear:both; line
    .ngg-galleryoverview {
    overflow: hidden;
    margin-top: 10px;
    width: 100%;
    /* clear:both; */
    display:block !important;

  4. timheckhausen
    Posted 6 years ago #

    @deus62 - vielen Dank für die superschnelle Hilfe. Deine Blogs gefallen mir übrigens sehr gut, schöner und klarer Style. Grüße nach D.! :)

    @petervanderdoes - thank you man. u rock. that was exactly what i needed. looks great now. thank you!

  5. lawvol
    Posted 6 years ago #

    Alright, I am having the same problem on a blog I'm helping a friend with, and tried commenting out the clear:both line, but it hasn't helped.

    Any other thoughts?
    Nevermind, I figured it out. Thanks.

  6. lawvol
    Posted 6 years ago #

    Okay ... I thought I had figured it out.

    I can now get the gallery to show up in main area at the top, but any text or other images after the gallery return to the bottom (after the longest column)

    I haven't had any of these problems on my own blog with NGG, what types of theme codes does it conflict with, or is there a workaround to to this?


  7. DuckDuke
    Posted 6 years ago #

    I'm having the same problem, I already wrote about it yesterday. So, if anyone knows why this is happening:


    If you guys want to take a look and give me some advice it would be great. I've never used this plugin until now, but I would like to do so. I can't start start making albums until this is solved, please give a hand :)

  8. WhisperT
    Posted 6 years ago #

    There are three places where clear:both can cause problems on some templates.

    • .ngg-galleryoverview
    • .ngg-albumoverview
    • .ngg-clear

    You should comment them out if your having these problems. BUT

    I would suggest possibly just adding this to the END of your style.css file:

    #content .ngg-galleryoverview, #content .ngg-galleryoverview, #content .ngg-galleryoverview {
        clear: none !important;

    #content in (your case) being the parent div that your galleries are displaying within.

    My reasoning behind this would be due to the auto-upgrade feature in WordPress. If used, it will delete customized files in the plugin folder and you could unknowingly loose your fix for this problem.
    If you put it in your theme's stylesheet, not only will it not conflict with future theme changes it will also not get lost upon upgrade of the NextGen plugin.

    If for some strange reason !important doesn't do the trick try moving the call for your style.css file down in the head of the document to occur below the <?php wp_head(); ?> this will ensure that your stylesheet is loaded AFTER the NextGen styles (therefore you can override undesirable styles set by your plugins).

    Hope that helps :) (constructive criticism of my methods always welcome)

  9. DuckDuke
    Posted 6 years ago #

    If this can help others:

    Yes, transforming them into comments did the trick. They are at the top now, in both th post and the page.

    Thanks. :)

    * Any idea why the galleries are created 2 times? It doesn't bother me much, I'm just curious if this is the default or is it just me.

  10. WhisperT
    Posted 6 years ago #

    Just remember that commenting them out in the nggallery.css will get lost if you use the auto-upgrade feature.

    Not sure about the other problem right now I'd have to take a look at it.

  11. Alex Rabe
    Posted 6 years ago #

    For all "Auto-Upgrader" :

    I also suggest to move all css code form nggallery.css to your theme css and disable the integrated CSS style sheet. As WhisperT mentioned the Auto-Upgrade-Feature will delete all custom modifictaion...

  12. DuckDuke
    Posted 6 years ago #

    I'm not sure at what you're referring, the update for the plugin or the update for WP itself?

    If it's about the upgrade for WP, I don't plan to switch to 2.5 any time in the future. If I'll do it I will move the code though. But not feeling the need for this now. :)

    If you are referring to the plugin, what means "auto-upgrader"? Usually a plugin is letting me know that a new version is available, and I can choose to install it or not. Is this different and auto-upgrades without me knowing it?

    * As for the other problem here is a link to show you what is happening:
    Whenever I make a new gallery, it's doubled somehow. Not very bothering, but still...

  13. Alex Rabe
    Posted 6 years ago #

    Since WP2.5 it's possible to have a one click upgrade for plugins...

  14. DuckDuke
    Posted 6 years ago #

    Oh, I'm using 2.3 now. Not planning on upgrading soon.

    And maybe this will help others: I found out that if I change the number of images shown (in Gallery -> Options -> Gallery settings), which by default is 20, to any number (I wanted to show only 4 images for a gallery on each post), the thing with the space occurs.

    Any idea what I must comment out this time? :-?

  15. DuckDuke
    Posted 6 years ago #

    Silly me. :) I've looked into the CSS and I found another clear:both which I took out, in -------Gallery navigation-------. I think that was the asnwer, I just had to look closely at the text.

    * What was the purpose for this clear:both command? Why is it there if it creates these problems?

  16. DuckDuke
    Posted 6 years ago #

    Sorry for the triple post, but testing it frther showed me a new error:

    picture with error

    There is no next button after the 4th pic. (In my case 4, because I wanted to show only 4, but I suspect it's the same for each number)...

  17. Alex Rabe
    Posted 6 years ago #

    It clear a float element (like the thumbails), otherwise some text behind will float on the most themes. Doesn't know why the hell , it produces this space...

    No floating elements allowed on either the left or the right side


  18. Alex Rabe
    Posted 6 years ago #

    Regaring the 4th pic, this is a feature of Thickbox. So not a bug :-)

  19. DuckDuke
    Posted 6 years ago #

    While I'm at it, I'd better ask this too:

    Is there no way to make the pages generated by NGG a little bit more customizable? Perhaps even search engine friendly?

    Whenever I click on the button of a gallery page to see the other pictures, it brings me to a page named like this:

    instead of, for example:
    which would translate into this:
    http://www.townportal.ro/poze/Cismigiu_p3 or something similar

    ... ?

  20. WhisperT
    Posted 6 years ago #

    @alexrabe - this problem really is theme specific, and based on whether floating elements are being executed properly. Technically clear: both; should do just that. In some cases removing the "both" property can cause other problems, like you said it can cause text to float around the galleries in strange ways.

    I have noticed though that most people having this space problem have a three column layout with the content being the center column. Maybe there could be a way or option in the NGG Settings that allows them to specify if they are having this trouble and then it just turns off the "both" property.

    @DuckDuke - There is an setting that does just that if I'm understanding you correctly. Gallery -> Options -> General then tick the box for "Activate Permalinks". After doing this though make sure you go and rebuild your permalinks so that it will work correctly.

  21. Alex Rabe
    Posted 6 years ago #

    Hey , you are my hero ! I didn't recognize that it's indeed a three column issue.
    I will create a new css for this themes ... Perfect.

  22. DuckDuke
    Posted 6 years ago #

    Thank you! thank you! thank you! :)
    I've cleared out the little thingies and the space is gone.
    I've checked what you've said and now it's just like I wanted it to be.

    Buuuuut }:ᦓ New issue:
    After testing it further in Opera and Firefox, all works fine.
    In Internet Explorer (or/and Maxthon), the big space is still there...
    Any thoughts on this?

    I have the same problem in one other place, where I don't have NGG installed:
    http://www.townportal.ro/utile/ - No plugins (no NGG), some scripts in the left column for time and date, converting money, and weather forcast.
    - Same big space showed only with IE.

    On my other 5 sections, I don't have this problem with the space. Maybe this can provide some insight and clues on the problem...
    http://www.townportal.ro/jocuri/ - I have flash games embedded, no NGG
    http://www.townportal.ro/muzica/ - I have an mp3 player, no NGG
    http://www.townportal.ro/carti/ - I have nothing yet :D
    http://www.townportal.ro/video/ - Many video players embedded, no NGG
    http://www.townportal.ro/blog/ - A bunch of plugins, no NGG
    - No big space, everything works fine in all browsers.

    No idea what is going on, but that doesn't say much, seeing as I've started using wordpress 2 months ago :)

  23. DuckDuke
    Posted 6 years ago #

    Can someone pls look at this browser thingie?

  24. Kijac
    Posted 6 years ago #

    I need help too :( :( :(:
    I don´t want to have the spaces after and between the albums. Who can help me??


    Edit: Oh no, what´s that now???

  25. William Speruzzi
    Posted 6 years ago #

    Love the plugin. Thank you for developing.

    I'm in a similar situation. I've /* clear:both; */ in all of my CSS sections for the plugin and I'm still getting a gap.

    Here's the gallery page from my site:


    Any help would be greatly appreciated.

  26. WhisperT
    Posted 6 years ago #

    @DuckDuke - I have have viewed that page in 3 versions of IE and do not see the space you are talking about. As far as squashing CSS issues with a design may I suggest installing Firebug it makes working on a CSS file a breeze.

    @Kijac and @wsperuzzi - There are three instances of clear:both that you have to comment out. Scan the file and make sure you got all of the ones mentioned above.

    @Kijac - after commenting out the both property you will also need to do some editing to your themes style sheet to force your containing div to wrap around the galleries. you will need to add clear:both; to this class .post .postmetadata which is located in your style.css file around line 194

    @alex - Here's hoping your serious cause I would be honored to be your hero :) As mentioned before if you need help just let me know I would love to contribute after all of the hard work I know you have put into this.

  27. William Speruzzi
    Posted 6 years ago #

    Thanks WhisperT. There are different choices for style sheets and I missed that I was working in the default. Works now. Excellent!

  28. maierma
    Posted 6 years ago #

    Hi folks,

    @@ WhispertT

    I'm happily using NEXTGen for a while now. Also using a 3-column-theme and had to take out the clear: both; to get it work properly (thanks @@ Alex for pointing that out t me some months ago!). so, I'm very much looking forward to a new version with specific styleheets for 3-column-themes.

    I have now one problem that I don't manage to get rid off (I'm a sucker for css ...). I have now added the NEXTGen Smooth Gallery plugin and the stylesheets are messing pages up.

    Maybe WhisperT has some ideas what to do here?
    Here's a link to a demo-page with odd behaviour (scroll down for the gallery!):

    I'd appreciate any suggestions on what's going wrong here (and where to fix!).

  29. WhisperT
    Posted 6 years ago #

    ;) In the file called nggSmooth.php around line 166 you will see another one of those rogue clear: both; properties. If you remove it your gallery will no longer drop down like that.

    @wsperuzzi - Welcome :) Glad it fixed the problem.

  30. maierma
    Posted 6 years ago #

    @@ WhisperT

    THANKS! That was it (line 166, btw).

    I was going through many, many ... css-files and some phps but didn't manage to trace down which one produced the clear: both;. I should spend some time getting to know css a bit better.

    "Hero" struck again. ;-)

Topic Closed

This topic has been closed to new replies.

About this Topic


No tags yet.