Reputation: 4085
I'm designing a footer on a HTML webpage with a radio-selection form on it. I have some buttons inside the footers div, centered using <center>
. Without the form on it, it works 100%. I can't get the form to display next to the other buttons, without using float: right;
in the stylesheet. When I use float, it is inconsistently dynamic with the rest of the buttons in the div. I've tried setting fixed heights, but I want it to be dynamic. So how can I get the form to display next the the links, in the same way that the links display next to each other?
JSFiddle: https://jsfiddle.net/o78s2s18/
Diagram:
Upvotes: 0
Views: 46
Reputation: 1726
You could put both groups of elements inside their own <div>
and float them both to the left.
<div style="float:left;">
<a id="BtnStyle" href="example.com">10 Views</a>
<a id="BtnStyle" href="http://mirum.weebly.com/">About</a>
<a id="BtnStyle" href="http://SD-Storage.weebly.com/#MirumFooter">SD-Storage</a>
</div>
<div style="float:left">
<form action="#" width="200px" class="ThemeSelector">
<input name="group1" type="radio" id="test1" class="red" />
<label for="test1">Test 1</label>
<br>
<input name="group1" type="radio" id="test2" class="red" />
<label for="test2">Test 2</label>
</form>
</div>
Upvotes: 2