How can I display images within the Top hook side by side and center them?

[FlorioAlagna]

Hello everyone, I have disabled the image slider and I would like to display images in the Top section of Theme Configurator to show up side by side (like they do below 768px) and centered .

 

As a css newbie I tried inspecting elements and I have already increased #htmlcontent_top to width: 100% and max-width: 100% but the second image still goes below the first one. I also have no idea how I could center things.

 

The website is https://lorghi.com/shop and it's using a forked version of default-bootstrap with a few modifications.

 

Thanks for your help.

Edited June 27, 2015 by FlorioAlagna (see edit history)

[vekia]

hello

 

hooks.css line 37

#htmlcontent_top ul li {
  width: 100%;
  margin-bottom: 10px;
}

change it to:
 

#htmlcontent_top ul li {
  width: 50%;
  margin-bottom: 10px;
  text-align: center;
}

effect:

[FlorioAlagna]

Thank you so much! That is precisely what I had intended.

[vekia]

you're welcome :-)

glad to hear that i could help

[FlorioAlagna]

you're welcome :-)

glad to hear that i could help

Hey vekia, without necessarily having to open a new topic I was hoping you could help me with an additional thing on that row: would you know how to make it responsive and scale down (or at least make the images to center and then scale down) when horizontal space is reduced?

 

Thank you in advance!

[dzinno]

Hi FlorioAlagna, 

 

can you please paste there whole hook.css file, so i can look what did you edit? Because when i edit what is writen there it does not work for me. 

Thank you

Dzinno