Skip to content
● Grav 2.2 is out: 2x faster cold starts and 96% less memory on big sites. Read the announcement →

How to horizontal radioboxes or checkboxes

form

Started by Mark 9 years ago · 2 replies · 1198 views
9 years ago

Hi,

Any idea how to align radio or checkboxes on one line (horizontally) in form?

see html below:

<div class="form-field horizontaaltje ">
<div class="form-label ">
<label class="inline">
Titel

HTML
                                    </label>
            </div>
                    <div class="form-data " data-grav-field="radio" data-grav-disabled="true" data-grav-default="&quot;markdown&quot;">

    <div class="radio  ">
        <input type="radio" value="dhr" id="titelmv-dhr" name="data[titelmv]">
        <label style="display: inline" class="inline" for="titelmv-dhr">Dhr.</label>
    </div>

    <div class="radio  ">
        <input type="radio" value="mevr" id="titelmv-mevr" name="data[titelmv]">
        <label style="display: inline" class="inline" for="titelmv-mevr">Mevr.</label>
    </div>

        </div>
        </div>
9 years ago

Did you try putting both inputs and their respective labels in one div with the radio class? It works html wise.

9 years ago

Well this can be done with some CSS.

TXT
.radio { display: inline-block }
👍 1

Suggested topics

Topic Participants Replies Views Activity
Forms & Blueprints · by Japhy, 2 weeks ago
2 261 4 days ago
Forms & Blueprints · by FrViPofm, 4 weeks ago
5 326 4 weeks ago
Forms & Blueprints · by Ton Haarmans, 6 years ago
13 2317 8 months ago
Forms & Blueprints · by Hugo Oliveira, 9 months ago
0 779 9 months ago
Forms & Blueprints · by Flachy Joe, 10 months ago
9 868 10 months ago