(3 сен 2015, 14:28) (0/0)
[0]
Помогите пж настроить css спойлер, почти все выровнил, но не получается сделать отступ текста внутри блока спойлера,
вот сам спойлер http://igrazona.wen.ru/test.htm
вот код
[code]
<!DOCTYPE HTML>
<html>
<head>
<meta charset="utf-8">
<title>Untitled</title>
<style type="text/css">
body {
background-color: #666666
}
.spoiler_desc {
background: #FFEDA3;
padding: 0px 5px 0px 0px;
border-radius: 0px 0px 5px 5px;
margin-top: 11px ; /*размер видимой полоски (заголовок чпойлера)*/
}
.spoiler_desc>p {
cursor: text;
color: #000000;
margin: 0px; /* отступ внизу блока */
}
.spoiler_close {
display: none;
position: absolute;
padding: 2px; /* размер второго заголовка после раскрытия спойлера */
}
.spoiler_open {
display: block;
margin: 1px; /*отступ между блоками*/
color: #FFFFFF;
outline: none;
position: relative;
overflow: hidden;
padding: 2px; /*размер заголовка спойлера (внутренний отступ)*/
}
.spoiler_close, .spoiler_open {
height: 27px;
width: 100%;
top: 0px;
left: 0px;
background: #222222;
border-radius: 3px 3px 0px 0px;
text-indent: 0px;
cursor: default;
border-bottom: 0px dotted #BFBFBF; /*разделительная полоска*/
padding-top: 5px
}
.spoiler_close:hover, .spoiler_open:hover { background: #555555; }
.spoiler_open:focus {
overflow: visible;
background: #333333; /*отступ в нутри блока*/
height: auto;
border-bottom: none;
padding-top: 10px
}
.spoiler_open:focus .spoiler_close { display: block; }
.spoiler_open:focus:before { display: none; }
.b { margin: 9px }
</style>
</head>
<body>
<div class="spoiler_open" tabindex="1">Актер возле актера
<div class="spoiler_desc">
<p><b class="divsp">Актер <b>1Удалён <u>возле актера</u> <b>2Удалён в радиусе <b>5.0 5.0</b> ( по xy ) и типом отображения <br>сферы: флаг <b>1</b> [1- Видна, 0- Не видна] </b>
</p><div tabindex="0" class="spoiler_close">00F2: actor 1@ near_actor 2@ radius 5.0 5.0 sphere 1
</div></div></div>
<div class="spoiler_open" tabindex="1">Актер возле актера
<div class="spoiler_desc">
<p>Актер <b>1Удалён <u>возле актера</u> <b>2Удалён в радиусе <b>5.0 5.0</b> ( по xy ) и типом отображения <br>сферы: флаг <b>1</b> [1- Видна, 0- Не видна]
</p><div tabindex="0" class="spoiler_close">00F2: actor 1@ near_actor 2@ radius 5.0 5.0 sphere 1
</div></div></div>
</body>
</html>[/code]
Добавлено 03.09.15 в 14:30:05:
сейчас там индент текста, а отступ так и не получается сделать, омогите пж настроить код
вот сам спойлер http://igrazona.wen.ru/test.htm
вот код
[code]
<!DOCTYPE HTML>
<html>
<head>
<meta charset="utf-8">
<title>Untitled</title>
<style type="text/css">
body {
background-color: #666666
}
.spoiler_desc {
background: #FFEDA3;
padding: 0px 5px 0px 0px;
border-radius: 0px 0px 5px 5px;
margin-top: 11px ; /*размер видимой полоски (заголовок чпойлера)*/
}
.spoiler_desc>p {
cursor: text;
color: #000000;
margin: 0px; /* отступ внизу блока */
}
.spoiler_close {
display: none;
position: absolute;
padding: 2px; /* размер второго заголовка после раскрытия спойлера */
}
.spoiler_open {
display: block;
margin: 1px; /*отступ между блоками*/
color: #FFFFFF;
outline: none;
position: relative;
overflow: hidden;
padding: 2px; /*размер заголовка спойлера (внутренний отступ)*/
}
.spoiler_close, .spoiler_open {
height: 27px;
width: 100%;
top: 0px;
left: 0px;
background: #222222;
border-radius: 3px 3px 0px 0px;
text-indent: 0px;
cursor: default;
border-bottom: 0px dotted #BFBFBF; /*разделительная полоска*/
padding-top: 5px
}
.spoiler_close:hover, .spoiler_open:hover { background: #555555; }
.spoiler_open:focus {
overflow: visible;
background: #333333; /*отступ в нутри блока*/
height: auto;
border-bottom: none;
padding-top: 10px
}
.spoiler_open:focus .spoiler_close { display: block; }
.spoiler_open:focus:before { display: none; }
.b { margin: 9px }
</style>
</head>
<body>
<div class="spoiler_open" tabindex="1">Актер возле актера
<div class="spoiler_desc">
<p><b class="divsp">Актер <b>1Удалён <u>возле актера</u> <b>2Удалён в радиусе <b>5.0 5.0</b> ( по xy ) и типом отображения <br>сферы: флаг <b>1</b> [1- Видна, 0- Не видна] </b>
</p><div tabindex="0" class="spoiler_close">00F2: actor 1@ near_actor 2@ radius 5.0 5.0 sphere 1
</div></div></div>
<div class="spoiler_open" tabindex="1">Актер возле актера
<div class="spoiler_desc">
<p>Актер <b>1Удалён <u>возле актера</u> <b>2Удалён в радиусе <b>5.0 5.0</b> ( по xy ) и типом отображения <br>сферы: флаг <b>1</b> [1- Видна, 0- Не видна]
</p><div tabindex="0" class="spoiler_close">00F2: actor 1@ near_actor 2@ radius 5.0 5.0 sphere 1
</div></div></div>
</body>
</html>[/code]
Добавлено 03.09.15 в 14:30:05:
сейчас там индент текста, а отступ так и не получается сделать, омогите пж настроить код
- 1 из 1
