JSFiddle - React, Tailwind, and code Playground

HTML

<select name="visible_select">
    <option>1</option>
</select>

<select name="hidden_select" class="hidden">
    <option>1</option>
</select>

<div class="hidden">
    <select name="in_hidden_div">
        <option>1</option>
    </select>
</div>
    
<div id="result"></div>

CSS

select {
    width:300px;
    padding:0;
    margin:0;
    border-width:1px;
}

.hidden {
    display:none;
}

JavaScript

$('select').each(function() {
    var $t = $(this),
        name = $t.attr('name'),
        cssw = $t.css('width'),
        jqw = $t.width(),
        pl = $t.css('padding-left'),
        pr = $t.css('padding-right'),
        ml = $t.css('margin-left'),
        mr = $t.css('margin-right'),
        bl = $t.css('border-left-width'),
        br = $t.css('border-right-width');
    
    $('#result').html($('#result').html() + '<b>' + name + '</b><br />width (css): ' + cssw + '<br />width (jquery): ' + jqw + '<br />padding (l r): ' + pl + ' ' + pr + '<br />margin (l r): ' + ml + ' ' + mr + '<br />Border (l r): ' + bl + ' ' + br + '<hr />');
});

    
/*
document.getElements('select').each(function($t) {
    var name = $t.getProperty('name'),
        cssw = $t.getStyle('width'),
        jqw = $t.getSize().x,
        pl = $t.getStyle('padding-left'),
        pr = $t.getStyle('padding-right'),
        ml = $t.getStyle('margin-left'),
        mr = $t.getStyle('margin-right'),
        bl = $t.getStyle('border-left-width'),
        br = $t.getStyle('border-right-width');
    
    $('result').set('html', $('result').get('html') + '<b>' + name + '</b><br />width (css): ' + cssw + '<br />width (mootools): ' + jqw + '<br />padding (l r): ' + pl + ' ' + pr + '<br />margin (l r): ' + ml + ' ' + mr + '<br />Border (l r): ' + bl + ' ' + br + '<hr />');
});
*/