Search the Community

Добрый день! Прошу помочь! Вставляю картинки в блок div и они прекрасно становятся по горизонтали относительно друг друга. Делаю подпись и все картинки уходят друг под друга. Что не так? <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>#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; }