Javascript 如何使用css3在父div中调整所有输入元素

我有下面的html标记，我想使用css3将父div中的所有输入元素放在单行（响应）中，css3目前正在工作，但使用jquery代码。 有人能帮我为每个子元素上的父div宽度划分创建css3或更小的公式吗

       <div class="row actualDiv">  
                <input typeof="text" placeholder="P1-D1" type="text" value="">
                <input typeof="text" placeholder="P1-D1" type="text" value="">
                <input typeof="text" placeholder="P1-D1" type="text" value="">
                <input typeof="text" placeholder="P1-D1" type="text" value="">
                <input typeof="text" placeholder="P1-D1" type="text" value="">
                <input typeof="text" placeholder="P1-D1" type="text" value="">
                <input typeof="text" placeholder="P1-D1" type="text" value="">
                <input typeof="text" placeholder="P1-D1" type="text" value="">
                <input typeof="text" placeholder="P1-D1" type="text" value="">
                <input typeof="text" placeholder="P1-D1" type="text" value="">
                <input typeof="text" placeholder="P1-D1" type="text" value="">
                <input typeof="text" placeholder="P1-D1" type="text" value="">
                <input typeof="text" placeholder="P1-D1" type="text" value="">
                <input typeof="text" placeholder="P1-D1" type="text" value="">
                <input typeof="text" placeholder="P1-D1" type="text" value="">
                <input typeof="text" placeholder="P1-D1" type="text" value="">
                <input typeof="text" placeholder="P1-D1" type="text" value="">
                <input typeof="text" placeholder="P1-D1" type="text" value="">
                <input typeof="text" placeholder="P1-D1" type="text" value="">
        </div>

编辑：

如果可以使用，那么就有可能通过css来实现。请注意，并非所有浏览器都支持它：

.actualDiv{
显示：-webkit flex；
显示器：flex；
}
.actualDiv输入[type=“text”]{
-webkit-flex:1；
弹性：1；
}

我不想使用jquery/javascript，我想在css@MUHAMMADMUBUSHERASLAM改为css解决方案。谢谢@fuyushimoya，我还有一个问题，我如何将边框保持在我在下面尝试的聚焦输入之上，但它对我无效，任何建议输入[type=text]：聚焦{边框：5px纯黑色！重要；z索引：1000；}您可能需要问另一个问题并创建一个演示来演示，是否有相关内容。我不确定我是否了解您所说的边界。您的意思是，您只希望边界位于顶部，而不希望位于左右底部？我在您的jsfiddle的集中输入上看到加厚的边界。如果有，您可以指定每个目录的边界，如

border top/borde左右

…像这样。

var Totalwidth = parseInt($('.actualDiv').css('width').replace('px', ''));
    var $child = $('.actualDiv').find('input[type="text"]');
    var eachwidth = Totalwidth / $child.length;
    $child.css('width', eachwidth + 'px');