Question

Есть отличный спойлер, но есть одна проблема. Иногда длина названия спойлера длинее, чем поле статьи, и поэтому спойлер вылазит за пределы и слова не переносятся. Как сделать так, чтобы все слова переносились

   <script>  function spoiler() { if(document.getElementById('spoiler').style.display == 'none'){ document.getElementById('spoiler').style.display = 'block'; }else{ document.getElementById('spoiler').style.display = 'none'; } }  </script>  <input type="button" onclick="spoiler()" value="Заголовок спойлера, который очень длинный и не переносится на другую строку"><br><br><div id="spoiler" style="top:50; left:50; font-size:15px; display:none;">Содержтмое спойлера, все слова переносятся </div>

Также есть вырезка из CSS, может тут можно исправить ошибку. 

   input[type=text],input[type=password],textarea {height: 28px;padding: 0 7px;font-family: 'PT Sans', Verdana, sans-serif;font-size:13px;color: #3B3B3B;background: #fff;border: 1px solid #ebebeb;outline: none;-webkit-box-sizing: border-box;-moz-box-sizing: border-box;box-sizing: border-box;}  input.securityCode {height: auto} textarea {padding: 5px 7px;height: auto;overflow: auto;resize: none;line-height: 20px} input[type=button],input[type=submit],input[type=reset],.button{margin: 0;padding: 0 10px; display: inline-block; text-align:center; height: 28px; font-family: 'PT Sans', Verdana, sans-serif;font-size:15px; color: #fff; text-decoration: none; border: 0; background-color: #f57557; cursor: pointer} input[type=button]:hover,input[type=submit]:hover,input[type=reset]:hover,.button:hover {text-decoration: none;background-color: #e35e3f;} .myBtnLeftA img, .myBtnRightA img {display:none;}

 

Answer 1

Наведите пример, ссылку на страницу с проблемой, чтобы ее было видно, после будем смотреть как ее исправлять.

Comments

Сылка на статью  там внизу есть этот спойлер

---

Все что мне нужно узнать, как сделать перенос слов в команде value="название спойлера"

---

Тима Питиримов,

Пропишите в стили:

input[type=button][onclick="spoiler()"] {
    white-space: inherit!important;
    height: auto!important;
    padding:5px;
}