Изменение местоположения объекта с помощью CSS

Я пытаюсь использовать только пароль Логин системы, можно просмотреть по следующему адресу: http://tinyurl.com/qamzr9k Изменение местоположения объекта с помощью CSS

я схватил и использовал CSS (с CSS сайта) в стиле и расположить окно входа в систему и кнопку отправки.

Однако есть большой серый уродливый бар, который находится по экрану, примерно в окне входа.

Я хотел бы переместить этот уродливый заголовок, оттуда, так как я хочу разместить другое содержимое выше формы входа.

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

Я также заметил, что необходимое поле отображаемого сообщения для ошибок вставляется в это поле. (пожалуйста, введите что-нибудь в поле пароля и отправьте, чтобы узнать, о чем я говорю). Итак, мне интересно, может ли перемещение серого окна означать перемещение необходимого отображения сообщений.

Весь CSS и т. Д. Слишком длинный список. Поэтому, пожалуйста, посетите: http://tinyurl.com/qamzr9k, а затем просмотрите исходный код.

Я думаю, что серый ящик отождествляется со следующим фрагментом фрагмента в теле страницы (я переименовал div);

<div class="topbar" style="width:500px; top: 209px; margin-left:auto; margin-right:auto; text-align:center"></div>

Спасибо всем

источник

2013-11-24 user2977144

Большое спасибо. Это сработало. Можете ли вы сказать, где я могу позиционировать форму ближе к вершине? Еще раз спасибо. – user2977144

Если вы переделаете свой html на следующий .., имея форму внутри ближайшего div, он должен завернуть всю форму внутри этого div ... включая верхнюю панель.

<div class="coming-soon"> 
    <form method="post"> 
    <span>Incorrect code.</span> 
    <input type="password" name="access_password"><input type="submit" name="Submit" value="Submit"> 
    </form> 
</div>

Я не могу видеть использование

<div class="topbar" ...

Так что, возможно, удалить, что

Вы можете стилизовать форму, как вы требуете держа его относительно вашего скоро ДИВ и имеющий сообщение об ошибке всегда прилагается в форме

источник

2013-11-24 11:41:00

Эй, Пал. Это сработало отлично. Большое спасибо. Однако, если вы посмотрите на код, можете ли вы точно сказать, где я могу внести изменения в его расположение сверху? Я не хочу ничего делать, чтобы снова испортить код. – user2977144

теперь вы можете управлять им через css в ближайшем классе. Удалите абсолютное позиционирование (если вам не нужно его хранить). Если это так, просто отредактируйте «верх», где вы хотите, .coming-soon { высота: 105px; левый: 50%; margin-left: -156px; margin-top: 95px; переполнение: скрыто; позиция: абсолютная; верх: 50%; } –

Еще раз спасибо. Я сделал именно это и свою работу. Я попытался добавить изображение, которое не отображается над полем входа. Я не уверен, что это проблема с CSS. Кроме того, окно входа в систему больше не отображается в Internet Explorer. Извините, что снова вас беспокоит. есть идеи? http://tinyurl.com/qamzr9k – user2977144

Попробуйте это:

form { 
animation: 1.5s ease 0s normal none 1 appear; 
background: linear-gradient(rgba(0, 0, 0, 0.1), rgba(0, 0, 0, 0.3)) repeat scroll 0 0 rgba(0, 0, 0, 0); 
border: 1px solid rgba(0, 0, 0, 0.3); 
border-radius: 6px; 
box-shadow: 0 1px 3px rgba(255, 255, 255, 0.4) inset, 0 1px 3px rgba(0, 0, 0, 0.45); 
padding: 10px; 
position: relative; 
top: -54px; 
}

Как вы можете видеть здесь, я добавил top, так что изначально ваша страница будет скрыть окно ошибки.

источник

2013-11-24 11:08:07

Спасибо. Тем не менее, я решил попробовать предложение, данное другим пользователем. Но спасибо за вашу щедрость и готовность помочь. – user2977144

Изменение местоположения объекта с помощью CSS

ответ

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