www.webdeveloper.com
Results 1 to 2 of 2

Thread: Bootstrap Image Gallery CSS problem effecting other list found solution

  1. #1
    Join Date
    Nov 2013
    Location
    new york
    Posts
    66

    Thumbs up Bootstrap Image Gallery CSS problem effecting other list found solution

    Bootstrap Image Gallery CSS problem effecting other list found solution
    Hi friends,
    How are you all designers and developers? okay fine.

    You know one interesting thing happened today. One of my old client asked to integrate latest jquery image gallery. So i went to jquery dot com and downloaded some popular jquery image sliders of course they are free. In that bootstrap image gallery i liked. And then integrated after i have designed my images in custom shape with good design. Everything went fine.

    In the end i found that this bootstrap image gallery css style is effecting my main menu list. I thought it is because of jquery or javascript, so may be i can't fix it. Then i looked into it. But that is because of bootstrap image gallery css only.
    That effect code is like this:
    *,*:before,*:after {
    -webkit-box-sizing: border-box;
    -moz-box-sizing: border-box;
    box-sizing: border-box;
    }

    I think box sizing is the new property of CSS3. Then i found the solution.

    Right click on the main menu --> inspect element (in google chrome browser, because you can automatically get CSS3 tags here) then in place of border-box i have placed 'content-box'.
    Then my output came like this:

    *, *:before, *:after {
    -webkit-box-sizing: content-box;
    -moz-box-sizing: content-box;
    box-sizing: content-box;
    }


    Okay now i will be relaxed. No.... my god, again that bootstrap image gallery is not working.
    I mean when pop up open, then css is not working. Then again i have started R&D on this.
    Then i have fixed the issue like this:

    .blueimp-gallery .modal-dialog { width: 750px; max-width: 800px;}

    Here my large view image size is 750pixels (do not consider thumbnail, it should be around 100pixels only). So i have made that modal dialog box width as equal to my image size. Then issue was solved.

    Now happy.

    First thing is 'as a designer we have to find as many ways as possible to fix the bugs'.
    Then we can find good solutions.

    Let me know your valuable response on this.
    Thank you friends.

  2. #2
    Join Date
    Dec 2013
    Posts
    1
    I would like to thank you for the efforts you have made in writing this post. your provided information is easy to understand and implement.

Thread Information

Users Browsing this Thread

There are currently 1 users browsing this thread. (0 members and 1 guests)

Tags for this Thread

Posting Permissions

  • You may not post new threads
  • You may not post replies
  • You may not post attachments
  • You may not edit your posts
  •  
HTML5 Development Center



Recent Articles