Q:

Fill Remaining Width of parent

I have a navigation menu, with a collapsible list of child pages. Except the dropdown element needs to have an accessible page on the same line as well. This is what I have so far.
<div class="container-fluid">
                <div class="row">
                    <div class="col-sm-3 col-lg-2">
                        <div class="navbar navbar-default navbar-fixed-side">
                            <ul class="nav" id="side-menu-0">
                                <li id="menu-template" class="nav">
                                    <a href="index.html"><i class="fa fa-dashboard fa-fw"></i>Dashboard</a>
                                </li>
                                <li id="menu-template-top" class="nav" role="menu">
                                    <a href="#" style="display:inline-block;" class="nav">Google</a>
                                    <a href="#menu-template-top-sub" data-toggle="collapse" class="nav navbar-nav pull-right" style="display:inline-block;"><span class="caret"></span></a>
                                            <ul id="menu-template-top-sub" class="collapse nav nav-second-level">
                                                <li class="nav">
                                                    <a href="flot.html">Flot Charts</a>
                                                </li>
                                                <li class="nav">
                                                    <a href="morris.html">Morris.js Charts</a>
                                                </li>
                                            </ul>
                                    <!-- /.nav-second-level -->
                                </li>
                            </ul>
                        </div>
                    </div>

Here is the working fiddle, so you can see what I am trying to do. I want the Link for "Google" to stretch across to the right, like the "Dashboard" link can do. Working Fiddle

A:

A simple fix for this is to do this:
<a href="#" style="display:inline-block; width:calc(100% - 40px);" class="nav">Google</a>

You could of course externalize this to a stylesheet if you wish.
The 40px in the calc(100% - 40px) is the width of your dropdown caret.
This makes it stretch all the way to the dropdown-expansion button.

