Обтекание текста кнопкой: проблема вертикального выравнивания - PullRequest
2 голосов
/ 03 января 2012

Мне нужно было обернуть текст внутри кнопок, чтобы найти решение:

Как обернуть текст кнопки HTML с фиксированной шириной

Однако после примененияРешением я заметил, что вертикальное выравнивание кнопок меняется.Вот скриншот:

http://tinyurl.com/88hah7l

Вот код:

<html>
<head>
    <title>Button Wrap</title>

    <style type="text/css">

        INPUT.StandardButton
        {           
            WIDTH: 87px; 
            HEIGHT: 38px;
            font-size: 10pt; 
            Font-weight: bold;                      
            cursor: pointer;
            FONT-FAMILY: Arial, Verdana;
            COLOR: #0049A5;                                 
        }

    </style>

<head>
<body>

    <input type="button" value="NoWrap" class="StandardButton" />
    <input type="button" value="This is Test 1" class="StandardButton" style="white-space: normal;" />
    <input type="button" value="This is Test 2" class="StandardButton" style="white-space: normal;"  />
    <input type="button" value="This is Test 3" class="StandardButton" style="white-space: normal;" />

</body>
</html>

Есть идеи, что вызывает изменение выравнивания?Спасибо!

Ответы [ 2 ]

6 голосов
/ 03 января 2012

Я не уверен, что является причиной этого смещения, но, похоже, vertical-align:middle, похоже, исправляет это:

http://jsfiddle.net/ptriek/Dr5hM/

0 голосов
/ 03 января 2012

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

Добро пожаловать на сайт PullRequest, где вы можете задавать вопросы и получать ответы от других членов сообщества.
...