change radiobuttonlist repeatdirection="horizontal" to vertical if mobile

Question

I have a webpage which contains radiobuttonlists. I would like to change the radibuttonlist repeatdirection from horizontal to vertical. I am using CSS Skeleton framework. So my page is responsive but asp:RadioButtonList doesnt change.

here is my code

<asp:RadioButtonList ID="rbl_payment_type" runat="server" RepeatDirection="Horizontal" AutoPostBack="true" OnSelectedIndexChanged="rbl_payment_type_SelectedIndexChanged">
   <asp:ListItem Value="0">Serbest Ödeme</asp:ListItem>
   <asp:ListItem Value="1">Ön Tanımlı Ödeme</asp:ListItem>
</asp:RadioButtonList>

how do I change it repeat direction for responsive html?

Answer 1

You might want to look into the RadioButtonList's RepeatLayout property, which determines if the radio button list is rendered as a table or not. Also, if you are using .NET 4.0 or later, then you have the option for a ordered list or unordered list.

Here is the documentation for RadioButtonList RepeatLayout property

Once you have it in a non-table layout, then I believe it will be more conducive to CSS for a responsive UI.