Help please place the form and the text is normal, not crooked. Menu

HTML:

<div class="menu"> <div class="menu_text"> <a href="#">Главная</a> <a href="#">Статьи</a> <a href="#">Файлы</a> </div> <form class="search" action="" method=""> <input class="search-txt" type="text" name="search-txt" /> <input class="search-btn" type="image" src="img/search-b.jpg" /> </form>

CSS:

  .menu { background: url(img / bm.jpg) center no - repeat; padding: 20 px; } .menu_text { position: absolute; margin - left: 10 px; } .menu_text a { font - family: "Times New Roman" serif; color: #fff; text - decoration: none; font - size: 25 px; margin - right: 60 px; } .search { margin - left: 650 px; }
  • 2
    Provide the code. do fiddle ... Something in Photoshop now I will correct the picture and send it to you as an answer :) - cyadvert

2 answers 2

Most likely you use as a button a picture that is larger than the text field.

For example,

 <div> <form><input type="text"><input type="button" value="Поиск"></form> </div>

... prints everything on one line. Why do you need to “chemize” with pictures instead of buttons, when you can make it easier? Moreover, the styles for the buttons can be set via CSS:

 button { /* стили для тега <button> */ } input[type=button] { /* стили для тега <input type="button"> */ }

    I agree with DeFF, and another reason could be the fact that in these elements display: inline-block; Here you should add the vertical-align: middle property and it should be displayed at the same level. But it is better to do normal buttons.