Hi everybody,

I found online this JavaScript snippet to highlight input elements when they get focus:

$(document).ready(function () {

    $("form div input").focus(function () {

        $("form div").each(function () {
            $(this).css("background-color", "white");
        });

        $(this).parent().css("background-color", "#F2FAED");
    });

});

But in addition to that, I'd like to select all current text in the textbox or multi-line editbox. How can I do that?

Also, a bit unrelated question - I see that we can not specify width for the div element (I see it highlighted and shown as violating HTML5 standards). Is where another way to specify that one control which is defined with this code

 <div id="Phone2">
        <div class="float-left">
            <div class="editor-label">
                @Html.LabelFor(model => model.Phone2)
            </div>
            <div class="editor-field">
                @Html.EditorFor(model => model.Phone2)
                @Html.ValidationMessageFor(model => model.Phone2)
            </div>
        </div>
        <div class="float-left">
            <div class="editor-label">
                @Html.LabelFor(model => model.Ext2)
            </div>
            <div class="editor-field">
                @Html.EditorFor(model => model.Ext2)
                @Html.ValidationMessageFor(model => model.Ext2)
            </div>
        </div>
    </div>

takes 75% of the div width and the Ext takes 25 % ? Using class float-left put them both side by side, which is the effect I want, but I also would like to make ext control smaller and phone bigger.