Выравнивание картинок с подписью по горизонтали

@HoseMose · Регистрация: 27.08.2013

Author24 — интернет-сервис помощи студентам

Добрый день!
Прошу помочь! Вставляю картинки в блок div и они прекрасно становятся по горизонтали относительно друг друга. Делаю подпись и все картинки уходят друг под друга. Что не так?

HTML5

 <div id="header-menu-i">
                 <p>ИЗДЕЛИЯ</p>
              <div id="header-menu-i-inner">
                        <form>
                          <img src="/images/iproduct/benz.jpeg" width="10%"><p>Бензиновые электростанции</p>
                          <img src="/images/iproduct/diesel.jpg" width="10%"><p>Дизельные электростанции</p>
                          <img src="/images/iproduct/gazoporshn.jpg" width="10%"><p>Газопоршневые электростанции</p>
                          <img src="/images/iproduct/gazturb.jpg" width="12%"><p>Газотурбинные электростанции</p>
                          <img src="/images/iproduct/zip.jpeg" width="12%"><p>Запчасти</p>
                          <img src="/images/iproduct/ups.jpg" width="10%"><p>ИБП и альтернативные источники питания</p>
                        </form>
                </div>
                </div>

CSS

#header-menu-i {
                        position:absolute;
                        padding-top:40px;
                        padding-bottom:40px;
                        left: 350px;
                        width:100px;
                        cursor: pointer;
                        color: #434342;
                        font-size: 20px;
                        font-family: "FFDINWebProMedium", Calibri, "Trebuchet MS", Arial, Helvetica, sans-serif;            -webkit-transition-duration: 0.3s;
            -moz-transition-duration: 0.3s;
            -o-transition-duration: 0.3s;
            transition-duration: 0.3s;
            -webkit-border-radius: 0 5px 5px 0;  
            -moz-border-radius: 0 5px 5px 0; 
            border-radius: 0 5px 5px 0;
}
#header-menu-i-inner {
            position: fixed;
            top: 85px;
            left: 0px;
            background: #FFFFFF;
            width: 0px;
            height: 0px;
                        font-size:0px;
            -webkit-transition-duration: 0.3s;
            -moz-transition-duration: 0.3s;
            -o-transition-duration: 0.3s;
            transition-duration: 0.3s;
            -webkit-border-radius: 0 0 5px 0;
            -moz-border-radius: 0 0 5px 0;
                            }
#header-menu-i:hover {
        }   
#header-menu-i:hover #header-menu-i-inner { 
             height: 300px;
                         width: 100%;
                         font-size:20px;   
                         border-style: groove;
        }

@Maryka · 28.10.2015, 15:31

У меня все нормально. Пришлите скриншот для полного понимания.

@HoseMose · 28.10.2015, 15:37 **[ТС]**

При наведение на кнопку ИЗДЕЛИЯ
del

@Maryka 0 / 0 / 1 Регистрация: 28.10.2015 Сообщений: 7
	28.10.2015, 15:31	2
	У меня все нормально. Пришлите скриншот для полного понимания. 0

@HoseMose 2 / 2 / 2 Регистрация: 27.08.2013 Сообщений: 156
	28.10.2015, 15:37 [ТС]	3
	При наведение на кнопку ИЗДЕЛИЯ del 0