Кнопка внизу, а другая кнопка сверху, почему?

У меня проблема с 2 кнопками с CSS. Я хочу выровнять две кнопки рядом друг с другом. Но CSS даже не хотел, чтобы я этого хотел. Потому что кнопка внизу, а другая - верхняя. См. Изображение: http://home.arcor.de/freedownload/buttonwrong.jpg Кнопка внизу, а другая кнопка сверху, почему?

Возможно, у вас есть решение для меня? Это будет полностью оценено.

Вот HTML код:

<head> 
<link href="formular.css" type="text/css" rel="stylesheet"> 
</head> 

<span id="form1"><input type="text" id="form_username" name="username"></span><span id="form2"><input type="image" src="loginbutton.png"></span>

А вот CSS код:

#form_username { 
    background: white url(username.png) left no-repeat; 
    background-position: 8px; 
    color: #adadad; 
    padding: 8px; 
    padding-left: 32px; 
    font-family: Verdana; 
    font-size: 12px; 
    width: 200px; 
    border: 1px solid #e4e4e4; 
    outline: 3px solid #efefef; 
}

источник

2013-10-06 mangosaft

JSFiddle woul Хорошо бы. Вы пробовали удалить прокладку: 8px? –

Я уже пробовал. Это не работает. Я работаю с JSFiddle .. но только я не могу найти решение. – mangosaft

@mangosaft: вы понимаете, почему он просит jsfiddle? Это значит, что мы можем видеть код. Нам все равно, если вы его используете, но это касается США: сообщества; люди, которые могут быть готовы ответить на ваш вопрос. –

Попробуйте добавить этот стиль к вашему #form_username

float: left;

Demo

источник

2013-10-06 15:05:01 akinuri

float: left автоматически сделает элемент отображаемым в виде блока, поэтому будет достаточно только float :) – nkmol

@nkmol больше похоже на 'inline-block', но хорошая точка. +1 – avrahamcool

С краем: 3px; то это работает. Спасибо! :) – mangosaft

Кнопка внизу, а другая кнопка сверху, почему?

ответ

Смежные вопросы