How to put an image next to each other

Question

I m trying to put these two  hyperlinked  icons next to each other but I can t seem to do that  As you can see  the twitter icon falls to the next line    they are both hyperlinked to their respective website     HTML   lt div class  nav3  style  height 705px   gt       lt div id  icons  gt  lt a href  http   www facebook com   gt  lt img src  images facebook png  gt  lt  a gt       lt  div gt       lt div id  icons  gt  lt a href  https   twitter com  gt  lt img src  images twitter png  gt  lt  a gt       lt  div gt   lt  div gt    CSS   nav3       background-color   E9E8C7      height  auto      width  150px      float  left      padding-left  20px      font-family  Arial  Helvetica  sans-serif      font-size  12px      color   333333      padding-top  20px      padding-right  20px      icons position relative       width  64px       height  64px              icons a hover        background   C93          display  block        How do I make the aligned next to each other   Thanks in advance

User · Answer

You don t need the div s   HTML    lt div class  nav3  style  height 705px   gt       lt a href  http   www facebook com   class  icons  gt  lt img src  images facebook png  gt  lt  a gt       lt a href  https   twitter com  class  icons  gt  lt img src  images twitter png  gt  lt  a gt   lt  div gt    CSS    nav3       background-color   E9E8C7      height  auto      width  150px      float  left      padding-left  20px      font-family  Arial  Helvetica  sans-serif      font-size  12px      color   333333      padding-top  20px      padding-right  20px      icons      display inline-block      width  64px       height  64px          a icons hover        background   C93       See this fiddle

User · Answer

Instead of using position relative in  icons  you could just take that away and maybe add a z-index or something so the picture won t get covered up  Hope this helps

User · Answer

Check this out  Just use float and get rid of relative   http   jsfiddle net JhpRk    icons float left

User · Answer

try putting both images next to each other  Like this        lt div id  icons  gt  lt a href  http   www facebook com   gt  lt img src  images facebook png  gt  lt  a gt  lt a href  https   twitter com  gt  lt img src  images twitter png  gt  lt  a gt       lt  div gt

User · Answer

Change div to span  And space the icons using  amp nbsp  HTML    lt div class  nav3  style  height 705px   gt    lt span class  icons  gt  lt a href  http   www facebook com   gt  lt img src  images facebook png  gt  lt  a gt    lt  span gt  amp nbsp  amp nbsp  amp nbsp    lt span class  icons  gt  lt a href  https   twitter com  gt  lt img src  images twitter png  gt  lt  a gt    lt  span gt    lt  div gt    CSS   nav3   background-color   E9E8C7  height  auto  width  150px  float  left  padding-left  20px  font-family  Arial  Helvetica  sans-serif  font-size  12px  color   333333  padding-top  20px  padding-right  20px      icons  display inline-block  width  64px   height  64px       a icons hover    background   C93       span does not break line  div does

[html] How to put an image next to each other

Examples related to html

Examples related to css

Examples related to image