We help IT Professionals succeed at work.
Get Started

Evenly space logos in footer widget

242 Views
Last Modified: 2017-11-15
We recently replaced the middle image logo (which display on all pages but home page) with code for a logo provided by the company that ranked this site.  After doing that, we noticed that the logos are no longer evenly spaced.  See screen shot below:

Site
https://rochesterinn.com/rochester-inn-room-amenities/

Screen shot
https://screencast.com/t/6JeQKW8xVA

I tried using inspector to fix but when I did and you resized site for a phone, then the left and right logo got super tiny.

Here is code provided for middle logo:
<div id="hc-ratingRatingHotel">
<div id="hc-ratingRatingHotel__inner"><img id="hc-ratingRatingHotel__ribbon" src="https://media.datahc.com/ratinghotel/stellar2/ribbon.png" />
<span id="hc-ratingRatingHotel__year">2017</span>
<span id="hc-ratingRatingHotel__award">RECOGNITION OF EXCELLENCE</span>
<div id="hc-ratingRatingHotel__hotelink"><a id="hc-ratingRatingHotel__hotelname" target="_blank"></a>The Rochester Inn</div>
<a id="hc-ratingRatingHotel__hclink" href="https://www.hotelscombined.com/" target="_blank" rel="noopener">HotelsCombined</a>

</div>
<div id="hc-ratingRatingHotel__rating"><span id="hc-ratingRatingHotel__number">9.4</span>
<span id="hc-ratingRatingHotel__pipe"></span> <span id="hc-ratingRatingHotel__ratedby">Rated by Guests</span></div>
</div>
<div id="hc-data__hotellink" style="display: none;">The_Rochester_Inn</div>
<script type="text/javascript" src="https://ajax.googleapis.com/ajax/libs/webfont/1/webfont.js"> </script> <script>(function(){var rand = Math.floor((Math.random() * 99999999) + 1); function loadjscssfile(a,b){if("js"==b){var c=document.createElement("script");c.setAttribute("type","text/javascript"),c.setAttribute("src",a)}else if("css"==b){var c=document.createElement("link");c.setAttribute("rel","stylesheet"),c.setAttribute("type","text/css"),c.setAttribute("href",a)}"undefined"!=typeof c&&document.getElementsByTagName("head")[0].appendChild(c)} loadjscssfile('https://media.datahc.com/ratinghotel/stellar2/styles.css?v' + rand, 'css'); loadjscssfile('https://media.datahc.com/ratinghotel/stellar2/script.js?v' + rand, 'js'); })(); </script>

Open in new window


Here is my custom code for footer:
.site-footer p {
     font-family:font-family: 'Josefin Sans', sans-serif;
  margin:0px;
  padding:0px;
  }
  
.footer-widgets .widget {
   	margin: 0px auto; 
  padding:0px;  
max-width: 1140px;
}

Open in new window



Any ideas how to fix?
Comment
Watch Question
CERTIFIED EXPERT
Fellow
Most Valuable Expert 2017
Commented:
This problem has been solved!
Unlock 1 Answer and 3 Comments.
See Answer
Why Experts Exchange?

Experts Exchange always has the answer, or at the least points me in the correct direction! It is like having another employee that is extremely experienced.

Jim Murphy
Programmer at Smart IT Solutions

When asked, what has been your best career decision?

Deciding to stick with EE.

Mohamed Asif
Technical Department Head

Being involved with EE helped me to grow personally and professionally.

Carl Webster
CTP, Sr Infrastructure Consultant
Ask ANY Question

Connect with Certified Experts to gain insight and support on specific technology challenges including:

  • Troubleshooting
  • Research
  • Professional Opinions
Did You Know?

We've partnered with two important charities to provide clean water and computer science education to those who need it most. READ MORE