Problem with image sizes in right column

Ben Keeton
asked 10 years ago

I am currently running DW-Focus on my site (www.medicalnews.md). I use the right column to run a variety of images (mainly ads) that are sized according to the specs you put out for DW-Focus. The images show up fine in the browser I typically use (Chrome) as well as IE. However, it was recently pointed out to me that the images are cut off (the right side of the image) when viewed in Firefox. Is there a way to address this?
Here is a screenshot in chrome:
https://www.dropbox.com/s/bqlu04nrzr8zlou/Screenshot%202014-11-19%2010.41.42.png?dl=0

and here is the same screenshot in Firefox:
https://www.dropbox.com/s/spahl4re9oe0z8n/Screenshot%202014-11-19%2011.38.54.png?dl=0

Thanks for your help.
ben

1 Answers

DominicStaff
answered 10 years ago

Hi,
To resolve this issue, you change column width of your site, to resolve it, you can do as the following:
Step1: Log in to Dashboard > Appearance > Customize > General Setting, add the following code to the Custom wp_head() code:

 <style>
@media (min-width: 1110px) {
/* Main */
#main > .container > .row {
background-position: 760px 0;
}

#primary {
width: 750    px;
}

.news-slider .carousel {
width: 500px;
}

.news-slider .carousel-inner,
.news-slider .carousel .item,
.news-slider .carousel .carousel-inner .hentry {
height: 100%;
}

.news-slider .carousel-list {
width: 219px;
}

#secondary {
width: 300px;
}

#secondary .entry-thumbnail img {
width: 250px;
}

.single .site-content > .post .entry-content {
max-width: 530px;
}
}
</style>

Step2: Add the following code to the Custom wp_footer() code:

<script>
var height = jQuery('.news-slider').height();
jQuery('.news-slider .carousel').css('height', height);
</script>

Step3: Move through Dashboard > Setting > Media, then change the image size here:
See the screesnhot: http://prntscr.com/587ir6
Hope this helps !