I basically have couple of questions with n number of options, these options are under a flex container with flex wrap set to wrap, if the options are getting wrapped i want the wrapped elements to be aligned both vertically and horizontally, is it possible to do this?
.options { display: flex; flex-wrap: wrap; }<!DOCTYPE html><html lang="en"><head><meta charset="UTF-8"><meta name="viewport" content="width=device-width, initial-scale=1.0"><title>Document</title></head><body><form class="questions"><fieldset><legend>This is question 1</legend><div class="options"><label for="1_0"><input id="1_0" type="radio" /><span>option 1</span></label><label for="1_1"><input id="1_1" type="radio" /><span>option 2</span></label><label for="1_2"><input id="1_2" type="radio" /><span>option 3</span></label><label for="1_4"><input id="1_4" type="radio" /><span>option 3</span></label></div></fieldset><fieldset><legend>This is question 2</legend><div class="options"><label for="2_0"><input id="2_0" type="radio" /><span>Lorem ipsum dolor sit amet</span></label><label for="2_1"><input id="2_1" type="radio" /><span>consectetur adipiscing elit</span></label><label for="2_2"><input id="2_2" type="radio" /><span>consectetur adipiscing elit, sed do</span></label><label for="2_3"><input id="2_3" type="radio" /><span>consectetur</span></label></div></fieldset></form></body></html>in this example, is it possible to make second questions 2nd and 4th option to start from same line ?
Thanks in advance.