Workaround:
1) Use RenderAs="SVG".
2) Set 100% width to the gauge's wrapper prior the resizing
Use the solution below to make the control responsive:
<table style="width: 100%;">
<tr>
<td>
<div style="width: 100%;" id="gauge"></div>
<telerik:RadLinearGauge runat="server" ID="RadLinearGauge1" RenderAs="SVG" Width="100%">
<Pointer Color="Gray" Size="10" />
<Scale Vertical="false" Min="0" Max="40">
<MinorTicks Size="20" />
<Ranges>
<telerik:GaugeRange Color="#D7E5D1" From="0" To="10" />
<telerik:GaugeRange Color="#EBE6D2" From="10" To="20" />
<telerik:GaugeRange Color="#F5D2D1" From="20" To="30" />
</Ranges>
</Scale>
</telerik:RadLinearGauge>
</td>
</tr>
</table>
<script type="text/javascript">
var $ = $telerik.$;
$(window).resize(function () {
$("#<%= RadLinearGauge1.ClientID %> > div")[0].style.width = "100%";
$find('<%= RadLinearGauge1.ClientID %>').get_kendoWidget().resize();
});
</script>