Как я могу нарисовать окно, используя CSS, как поле ответа в stackoverflow?

Question

Как я могу нарисовать коробку в CSS? Я хочу, чтобы поле, похожее на зеленое, использовалось для отображения количества ответов на вопрос в stackoverflow?

Answer 1

Используйте Firebug и функцию «Осмотреть»; укажите на поле ответа здесь на SO и скопируйте HTML и CSS из консоли Firebug.

Answer 2

CSS:

.answerbox
{
height: 150px; /*Specify Height*/
width:  150px; /*Specify Width*/
border: 1px solid black; /*Add 1px solid border, use any color you want*/
background-color: green; /*Add a background color to the box*/
text-align:center; /*Align the text to the center*/
}

HTML: <div class="answerbox">4 <br /> Answers</div>

Answer 3

Используйте любой элемент - например, div, убедитесь, что он отображается как элемент уровня блока (т.е. display: block), и задайте ему границу.

.box { border: 1px solid #088; font-size: 4em; }

<div class="box">6</div>

Хорошо работает.

Answer 4

Вы также можете использовать Панель инструментов доступности AIS - http://www.visionaustralia.org.au/ais/toolbar/ - чтобы показать CSS, используемый для сайта, среди целого ряда других вещей.

Answer 5

эта страница: http://www.w3.org/TR/CSS2/box.html

была первой найденной страницей при поиске в Google по запросу "css box"