Re: Jquery to center: Form with multiple hidden divs -- JS will size to the smallest div....

[Chris Lerum]

This isn't rails-related, but for centering/laying out things neatly, I'd suggest using something like Bootstrap and its grid system.

On Tuesday, May 5, 2015 at 12:51:42 PM UTC-4, Elizabeth McGurty wrote:

...despite monitor

On Tuesday, May 5, 2015 at 12:49:05 PM UTC-4, Elizabeth McGurty wrote:

On my site I guess I have about 20 forms, four of which have multiple hidden divs within the forms of varying sizes. 

For all of my forms the following works, but for those with the multiple divs... it sizes height to the smallest div.  What should I do?  Should I JS code specifically for those forms on load of the divs to manage height, or is there something in my JS that I am not aware and should use.... AND, of course, if there is a gem to manage centering I would love to learn about it.  The point in centering, is that I want the width of my pages to be centered and nicely bordered  despite browser....  I realize and am sure that you folks may have excellent alternatives, I would like to know what you have used.

$(document).ready(function() {


    $.fn.center = function() {

       
        var element = $(this);
        var e_width = element.width();
        var win_width = $(window).width();
        var left_margin_calc = (win_width - e_width) / 2;
        element.css('margin-left', (left_margin_calc + "px"));

    };

    $.fn.center_form = function() {
        var element = $(this);
        var e_width = element.width();
        var win_width = $("div.form_wrapper").width();
        var left_margin_calc = (win_width - e_width) / 2;
        element.css('margin-left', (left_margin_calc + "px"));
         var div_height = $("div.form_wrapper").height();
         element.css("height", div_height);
         element.css('border', '2px solid #4A572B');
    };

    $("div.form_wrapper").center();
    $("form").center_form();
 
});

Thanks,

Liz McGurty
www.ecomarket.org