Dynamic CSS Vs Inline Issues in Code any Way around in a WordPress Themes?

Well another solution would be to use wp_add_inline_style() which affords you an opportunity to inject dynamic inline styles:

function my_custom_style() {

    wp_enqueue_style(
        'custom-style',
        get_template_directory_uri() . '/css/custom-style.css'
    );

    //our customer percentage set by a user in some options panel
    $percentage = get_theme_mod('my-custom-percentage');

    $inline_style =<<<DOC

    .progress-bar {
        width: {$percentage}%;
    }

DOC;   

    //inject our custom percentage after "custom-style.css"
    wp_add_inline_style( 'custom-style', $inline_style );

}

add_action('wp_enqueue_scripts', 'my_custom_style');

Aside from that, when a user changes settings in the backend it is also possible to generate a css file programmatically, storing it somewhere in the uploads directory and then dynamically enqueueing that file using wp_enqueue_scripts.

You can also hook onto wp_head and inject your styles that way too although probably not the best way, but here’s an example just for the sake of it:

function my_custom_style() {

    $percentage = get_theme_mod('my-custom-percentage');

    ?>

    <style type="text/css">
        .progress-bar {
            width: <?php echo $percentage; ?>%;
        }
    </style>

    <?php

}

add_action('wp_head', 'my_custom_style', 100);