Как сделать кнопки со середине?

Question

[Антон]

<script src="http://code.jquery.com/jquery-latest.js"></script>

<style>
   label {margin:0 auto;

    width: 32px;
    height: 26px;
    display: inline-block;
    position: relative;
   }
   input[type="radio"] + span {
    position: absolute;
    left: 0; top: 0;
    width: 100%;
    height: 100%;
    background: url(http://www.greveniotis.gr/images/icons/rss-icon.png) no-repeat;
    cursor: pointer;
   }
   input[type="radio"]:checked + span {
     position: absolute;
    left: 0; top: 0;
    width: 100%;
    height: 100%;
    background: url(http://www.greveniotis.gr/images/icons/rss-icon.png) no-repeat;
    cursor: pointer; 
   }
  </style>


<script type="text/javascript">
$(document).ready(function (){
	$(':radio').click(function (){
		if (this.checked) {
			$('#test').attr('src',this.value);
		}
	});
});
</script>
<div id ="centerkn">

<img id='test' src='/upload/connemarabrown.png'/></br>
	<label>
		<input type='radio' name='scr' value='/upload/connemarabrown.png'/><span></span>
	</label>

	<label>
		<input type='radio' name='scr' value='/upload/connemarablue.png'/><span></span>
	</label>

</div>

Как сделать кнопки radio (две в линию) по середине снизу относительно картинки?

Comments

[Максим Софронов]

Оформите код в песочнице https://jsfiddle.net/, может кто и поможет тогда.

[Артем Рыженко]

https://jsfiddle.net/j01kjqy3/
Вот так например. Самый простой вариант. Блоку фиксированную ширину, левый и правый margin auto и выровнять по центру элементы внутри блока.