| |
|
|
| | Здравствуйте! С Новым 2012 годом!!! :)
Делаю для себя викторину похожую на О, счастливщик!, только с определенной тематикой - английский язык. Работаю с 2 зайцами - и программирование учу и английский:))).
<style>
#mainDiv{
margin: 0 30%;
background-color: black;
color: white;
font-size: 25px;
font-weight: bold;
border-radius: 50px;
}
#question{
text-align: center;
border: 8px solid purple;
background-color: green;
border-radius: 50px;
margin: 15px 5px;
}
.response{
width: 50%;
text-align: center;
margin: 15px 5px;
display: inline;
border: 2px solid white;
}
.response:hover{
background-color: green;
cursor: pointer;
border: 8px solid purple;
}
.line{
margin: 15px 0px;
}
#bottommenu{
text-align: center;
}
</style>
<div id="mainDiv">
<div id="question">
???????Здесь вопрос?????????
</div>
<div id="line1" class="line">
<div id="response1" class="response" onclick="">
!!!!Здесь ответ номер 1!!!!
</div>
<div id="response2" class="response" onclick="">
!!!!Здесь ответ номер 2!!!!
</div>
</div>
<div id="line2">
<div id="response3" class="response" onclick="">
!!!!Здесь ответ номер 3!!!!
</div>
<div id="response4" class="response" onclick="">
!!!!Здесь ответ номер 4!!!!
</div>
<div id="bottomMenu">
<input type="button" value="forward" onclick=""/>
</div>
</div>
</div>
|
Вот HTML страницы. Возникла проблема с размещением div класса response. По идее они должны иметь ширину 50% своего родителя и не лезть друг под друга. То есть я хочу добиться симмеtрии, и здесь возникает вопрос - как это сделать? На тот width 50%, который я прописал, браузер(Хром) не реагирует:(. | |
| |
|
