Почему кнопка не выравнивается по центру, и почему границы не меняются, как я их сделал? - PullRequest
0 голосов
/ 27 июня 2018

Я экспериментирую с внутренним CSS на HTML-странице. Вот код, который я использую:

button {
    text-align: center;
    font-size:50px;
    color:black;
    border-style:dotted;
    border:2px solid white;
    border-color:red;
}

Почему кнопка не выравнивается по центру? И почему его границы не становятся пунктирными?

Кроме того, я хотел поместить кнопку рядом с текстом, который находится внутри его собственных границ, поэтому я попытался поместить код кнопки в код <p>, но кнопка все равно не выравнивается по центру, если я используйте код <h1>, тогда кнопка выравнивается, но если я размещу код кнопки вне кода <p> или <h1>, то он также не выравнивается. Так почему же кнопка не выравнивается, если она внутри <p>?

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

Ответы [ 2 ]

0 голосов
/ 28 июня 2018

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

Однако я до сих пор не могу понять, почему выравнивание текста не работает.

0 голосов
/ 27 июня 2018

Попробуйте просто обернуть свою кнопку в a, а затем использовать css для выравнивания текста, чтобы центрировать div вместо кнопки. Помните, что хотя вы очень можете поместить кнопку в тег

, этот тег предназначен для текстовых абзацев, а не для ввода.

<div class="buttonHolder">
<input value="Search" title="Search" type="submit" id="btn_s"> 
<input value="I'm Feeling Lucky" title="I'm Feeling Lucky" name="lucky"type="submit" id="btn_i">
</div>

.buttonHolder{ text-align: center; }

См. Этот связанный вопрос: центральные кнопки отправки формы html / css

Что касается вашего второго вопроса, пожалуйста, имейте в виду, что лучше всего задавать только один вопрос на пост, и мне потребуются дальнейшие разъяснения относительно того, что именно вы имеете в виду.

...