За последние 24 часа нас посетили 21718 программистов и 1711 роботов. Сейчас ищут 1069 программистов ...

При выведении ошибки на экран меняется CSS

Тема в разделе "Вопросы от блондинок", создана пользователем zlojnaxa, 14 май 2016.

  1. zlojnaxa

    zlojnaxa Активный пользователь

    С нами с:
    18 ноя 2015
    Сообщения:
    47
    Симпатии:
    4
    Здравствуйте!
    Есть форма входа http://cn41983.tmweb.ru/
    Если неправильно указать логин или пароль то при выводе соответствующего сообщения на экран input'ы меняют размер.
    Подскажите пожалуйста как это исправить, что я делаю не так? Я так понимаю в css надо выставить какое то свойство, но не могу понять какое.
    На всякий случай исходники. Сама форма:
    HTML:
    1.  
    2. <?php
    3.  
    4. $error = '<div class="error_login">Неверно введен логин или пароль</div>';
    5. if(isset($_POST['B1']))
    6. {
    7.   $username = mysql_real_escape_string($_POST['username']);
    8.   $upass = mysql_real_escape_string($_POST['pass']);
    9.   $res=mysql_query("SELECT * FROM users WHERE username='$username'");
    10.   $row=mysql_fetch_array($res);
    11.  
    12.   if($row['password']==$upass)
    13.   {
    14.     $_SESSION['user'] = $row['user_id'];
    15.     header("Location: home.php"); // куда направить если юзер ввел
    16.                         // правильно логин с паролем
    17.   }
    18.   else {
    19.     echo $error;
    20. }
    21. }
    22. ?>
    23.  
    24. <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
    25. <html xmlns="http://www.w3.org/1999/xhtml" lang="en" xml:lang="en">
    26.  
    27. <link rel="shortcut icon" href="favicon.ico"/>
    28. <title>Вход</title>
    29.  
    30. <link href="css/style_capcha_login.css" rel="stylesheet" type="text/css" />
    31.  
    32. </head>
    33. <body style="height: 100%;
    34.        margin: 0;
    35.        padding: 0;
    36.        ">
    37.  
    38. <div class="wrap">
    39.  
    40. <form name="register" method="post" id="register">
    41.        
    42.  
    43.         <div class="fields">
    44.         <input name="username" type="text" placeholder="Логин" size="50" id="username" required="required">
    45.         <input name="pass" type="password" placeholder="Пароль" size="50" id="pass" required="required">
    46.         </div>
    47.  
    48.         <div>
    49.         <input type="submit" value="Войти" name="B1" class="submit">
    50.         </div>
    51.  
    52. </div>
    53.  
    54. </form>
    55. </body>
    56. </html>
    57.  
    И стиль который с ней работает:
    Код (CSS):
    1. .wrap {
    2. display:block;
    3. width: 520px;
    4. height: 205px;
    5. margin: 0 auto;
    6. margin-top: 20px;
    7. background: #7F7F7F;
    8. padding: 20px;
    9. border-radius: 10px;
    10. }
    11.  
    12. .fields input[type=text], input[type=password] {
    13. height: 20px;
    14. width: 485px;
    15. margin: 7px 0;
    16. font-size: 17px;
    17. border: #CBCBCB;
    18. border-radius: 5px;
    19. padding: 15px;
    20. margin-top: 10px;
    21. vertical-align: top;
    22. }
    23.  
    24. .submit {
    25. width: 515px;
    26. background: #282828;
    27. color: #FFFFFF;
    28. height: auto;
    29. margin-left: 0px;
    30. margin-left: 0px;
    31. font-size: 16px;
    32. border-radius: 5px;
    33. border: #CBCBCB;
    34. padding: 10px;
    35. margin-top: 0px;
    36. cursor: pointer;
    37. letter-spacing: 1px;
    38. padding: 20px 15px;
    39. }
    40.  
    41. .submit:hover {
    42. background: #FFFFFF;
    43. color: #FF8600;
    44. }
    45.  
    46. .error_login {
    47. width: 100%;
    48. height: 50px;
    49. position: relative;
    50. top: 0;
    51. z-index: 2;
    52. background: #FF5C2D;
    53. color: #FFF;
    54. margin: 0 auto;
    55. padding: 10px;
    56. font-weight: 300;
    57. text-align: center;
    58. font-size: 20px;
    59. line-height: 45px;
    60. font-family: TitilliumText22LBold,ArtifikaMedium,Arial,Helvetica,sans-serif;
    61. letter-spacing: 1px;
    62. }
     
  2. denis01

    denis01 Суперстар
    Команда форума Модератор

    С нами с:
    9 дек 2014
    Сообщения:
    12.227
    Симпатии:
    1.714
    Адрес:
    Молдова, г.Кишинёв
    PHP:
    1. $error = '<div class="error_login">Неверно введен логин или пароль</div>';
    это ломает DOCTYPE который должен быть первой строчкой, даже переноса строки и пробел перед ним лучше не ставить.
     
  3. zlojnaxa

    zlojnaxa Активный пользователь

    С нами с:
    18 ноя 2015
    Сообщения:
    47
    Симпатии:
    4
    Подскажите как можно это реализовать?, что бы не ломало DOCTYPE
     
  4. denis01

    denis01 Суперстар
    Команда форума Модератор

    С нами с:
    9 дек 2014
    Сообщения:
    12.227
    Симпатии:
    1.714
    Адрес:
    Молдова, г.Кишинёв
    Ну div просто перенеси в body
     
  5. zlojnaxa

    zlojnaxa Активный пользователь

    С нами с:
    18 ноя 2015
    Сообщения:
    47
    Симпатии:
    4
    Так пытался сделать, но из за того что div выводится по условию if не могу понять как его туда впихать, пробовал сделать div hidden- но не знаю как его тогда запустить по if
     
  6. denis01

    denis01 Суперстар
    Команда форума Модератор

    С нами с:
    9 дек 2014
    Сообщения:
    12.227
    Симпатии:
    1.714
    Адрес:
    Молдова, г.Кишинёв
  7. zlojnaxa

    zlojnaxa Активный пользователь

    С нами с:
    18 ноя 2015
    Сообщения:
    47
    Симпатии:
    4
  8. denis01

    denis01 Суперстар
    Команда форума Модератор

    С нами с:
    9 дек 2014
    Сообщения:
    12.227
    Симпатии:
    1.714
    Адрес:
    Молдова, г.Кишинёв
    Так попробуй.
    Можно её заменить на это
    HTML:
    1. <!DOCTYPE html>
    Но сам подумай, проблему возможно это решит, но совсем дурным образом.

    HTML:
    1.  
    2. тут не размещай div и другие теги
    3. <!DOCTYPE html>
    4.     <title></title>
    5. </head>
    6. во тут самое место для тегов
    7. </body>
    8. </html>
     
  9. denis01

    denis01 Суперстар
    Команда форума Модератор

    С нами с:
    9 дек 2014
    Сообщения:
    12.227
    Симпатии:
    1.714
    Адрес:
    Молдова, г.Кишинёв
    Замени
    PHP:
    1. $error = '<div class="error_login">Неверно введен логин или пароль</div>';
    на
    PHP:
    1. $error = false;
    это
    PHP:
    1.   else {
    2.     echo $error;
    3. }
    на

    PHP:
    1.   else {
    2.     $error = true;
    3. }
    это удали, body уже есть выше
    HTML:
    после
    HTML:
    1. <body style="height: 100%; margin: 0; padding: 0; ">
    вставь
    PHP:
    1. <?php
    2. if($error) {
    3. ?>
    4. <div class="error_login">Неверно введен логин или пароль</div>
    5. <?php
    6. }
    7. ?>
     
    zlojnaxa нравится это.
  10. zlojnaxa

    zlojnaxa Активный пользователь

    С нами с:
    18 ноя 2015
    Сообщения:
    47
    Симпатии:
    4
    Большое спасибо помогло!