CODEWITHSUNDEEP
htmlwidthcentercss
user2443235
user2443235

Reputation: 11

Centering a Div with a 100% width AND max width property?

A question on how to center a div

When the divs have a fixed width (y px), I just use the left: 50% and margin-left: -y/2 px;

But how would I center a div that has a width:100% and a fixed max width? i.e.

body_container

{

position: absolute;
margin: auto;
max-width: 1750px;
height: 100%;
width: 100%;

}

Upvotes: 0

Views: 233

Answers (1)

geovani075
geovani075

Reputation: 377

Try this jQuery to make a div center of the page:

<script>
    jQuery.fn.vh_center = function (absolute) {
        return this.each(function () {
            var t = jQuery(this);

            t.css({
                position:   absolute ? 'absolute' : 'fixed', 
                left:       '50%', 
                top:        '50%', 
            }).css({
                marginLeft: '-' + (t.outerWidth() / 2) + 'px', 
                marginTop:  '-' + (t.outerHeight() / 2) + 'px'
            });

            if (absolute) {
                t.css({
                    marginTop:  parseInt(t.css('marginTop'), 10) + jQuery(window).scrollTop(), 
                    marginLeft: parseInt(t.css('marginLeft'), 10) + jQuery(window).scrollLeft()
                });
            }
        });
    };



    $(document).ready(function(){

                               $('#Your_div').vh_center();

                               });

</script>

Upvotes: 1

Related Questions