2 ways to center a column in Twitter Bootstrap 3

Here are 2 ways which you can use whenever you need to center a column div within `.container` in Twitter Bootstrap 3 as well as to keep empty space outside the `div` to be evenly distributed. First approach uses offset feature available in Bootstrap while it has a limitation and second approach is using `center-block` class with setting `float: none` in Twitter Bootstrap.

Continue Reading ››

Make the Footer Stick to the Bottom of a Page

When a page contains a large amount of content, the footer is pushed down off the viewport, and if you scroll down, the page ‘ends’ at the footer. However, If the page has small amount of content, the footer can sometimes ‘cling’ to the bottom of the content, floating halfway down the page, and leaving a blank space underneath, which looks ugly. So we need to make the footer stick to the bottom of page (not always fixed and visible).

Continue Reading ››

How to set scroll position to bottom in a div using javascript

Generally we create a div with the content and dynamically update the content. Further, we want to maintain the scroll position according to updated content. So there is one question of how to set scroll position to bottom in a div using JavaScript. Same type of problem I faced few days ago when I was working with a ajax message application and I am trying to get a div to scroll to the bottom when chat is updated.

Continue Reading ››

Find object by value in array of objects

In PHP we either create objects and their array, or database returns array of objects as result-set of some query. There we might need to find an object which have a particular property-value pair. There is no direct function available in PHP to perform the same so I’m explaining here how can we find object by value in array of objects by using a foreach loop.

Continue Reading ››

Fancybox ajax content & navigation issue in group & popup

While working with fancybox, you might have noticed that any button or link or input inside fancybox popup just behaves like previous/next item slider, making that coming item to appear in popup rather of doing it’s assigned code on click. All the reason is the width specified for `fancybox-nav` class with higher `z-index` for it.

Continue Reading ››

Application Development & Informative Tutorials by Fellow Tuts

Back to Top