Very, very close now.
1. When you are on a page other than the home page (which has the featured slider), the image in the promotion is slightly cut off at the top. Actually, I just checked the landscape view on mobile … it is cut off quite a bit there. Might have to do with my logo … let me know if I need to create a new topic for this.
2. When you shrink the width of the page so that the left/right sections of the promotion are stacked, the left section only takes up the width specified by “#promotion-message .left” css you gave (which does fix the look for when the left/right sections are next to each other). This is especially odd-looking on mobile devices.
Here’s the relevant additional css I have so far. Note that I adjusted the width from 75% to 60% and I’m also including the logo css in case that is related to the image getting cut off. Let me know if you need to me to post all my additional css. Thanks!
/* Fix problem with left/right Promotion Headline widgets */
.section.left {
float:left;
}
.section.right {
float:left;
}
.promotion-button.roll-button.more-button {
margin-top:10px !important;
}
#promotion-message .left {
width:60%;
}
/* Shrink logo when scrolled */
.float-header #site-logo img {
width: 200px;
transition: all 0.5s ease;
}