Edit in JSFiddle

(function () {
    webshim.setOptions('forms', {
        lazyCustomMessages: true,
        iVal: {
            //add config to find right wrapper
            fieldWrapper: '.form-group',

            //add bootstrap specific classes
            errorMessageClass: 'help-block',
            successWrapperClass: 'has-success',
            errorWrapperClass: 'has-error',
            
            //general iVal cfg
            sel: '.ws-validate',
            handleBubble: 'hide' // hide error bubble
        }
    });

    //load forms polyfill + iVal feature
    webshim.polyfill('forms');
})();
<form action="#" class="form-horizontal ws-validate">
    <div class="form-group">
        <fieldset class="col-sm-10">
            <legend>telephone group</legend>
            <div class="row">
                <div class="col-xs-4">
                    <input type="tel" class="form-control" title="Telephone prefix. Allows digits, + and space signs. At least 2. characters." pattern="[\+\s0-9]{2,6}" required="" />
                </div>
                <div class="col-xs-8">
                    <input type="tel" class="form-control" title="Telephone number. Allows at least 3 characters. Only digits and space signs are allowed" pattern="[\+\s0-9]{3,9}" required="" />
                </div>
            </div>
        </fieldset>
    </div>
    <div class="form-group">
        <fieldset class="col-sm-10">
            <legend>radio group</legend>
            <div class="radio">
                <label>
                    <input type="radio" name="optionsRadios" id="optionsRadios1" value="option1" required="" />Option one is this and that&mdash;be sure to include why it's great</label>
            </div>
            <div class="radio">
                <label>
                    <input type="radio" name="optionsRadios" id="optionsRadios2" value="option2" />Option two can be something else and selecting it will deselect option one</label>
            </div>
        </fieldset>
    </div>
    <div class="form-group">
        <label for="inputEmail3" class="col-sm-2 control-label">Email*</label>
        <div class="col-sm-10">
            <input type="email" class="form-control" id="inputEmail3" placeholder="Email" required />
        </div>
    </div>
    <div class="form-group">
        <label for="inputPassword3" class="col-sm-2 control-label">Password*</label>
        <div class="col-sm-10">
            <input type="password" class="form-control" id="inputPassword3" placeholder="Password" required />
        </div>
    </div>
    <div class="form-group">
        <div class="col-sm-offset-2 col-sm-10">
            <div class="checkbox">
                <label>
                    <input type="checkbox" />Remember me</label>
            </div>
        </div>
    </div>
    <div class="form-group">
        <div class="col-sm-10">
            <button type="submit" class="btn btn-primary">submit</button>
        </div>
    </div>
</form>
body {
    margin: 10px;
    padding: 10px;
}
.form-group >[class*="col-"] + .ws-errorbox {
    padding: 0 15px;
}
legend {
    margin: 3px 0 10px;
}