Text on Genesis Sandbox Featured Content widget cut-off on mobile phone

[treenao]

Hi all! I have the Genesis Sandbox Featured Content widget on a page with widgetized sections on my blog:

My issue is in the section for "Books I've Written", the text displayed in the widget gets cut off when viewed (portrait) on an iPhone. It's fine on any other device.

I don't know where and what in the CSS to change to correct this. Any help would be appreciated.

Lastly, I'm using the Daily Dish Pro theme.

http://theeverydayprojectblog.com/inesbyao-author-project/

[Porter]

Find this line in your style.css:

middle .featuredpost .entry {
width: 340px;
}

Change the 340px to 100%, that seems to do the trick from what I'm seeing. What this does is allow the text to use the entire space, no matter what the space given.

---

Buy me a beer? | Try DigitalOcean VPS Hosting

[treenao]

Hi Porter,
I tried it, but it's still not working 🙁 I don't know what's going on because the exact same widget that's in the widget area below is showing up fine on iPhones and smaller devices. What am I doing wrong?

`/* Featured Content
--------------------------------------------- */

.daily-dish-home .entry,
.daily-dish-authorproj .entry,
.sidebar .featured-content .entry {
margin-bottom: 30px;
}

.before-footer-widgets .featuredpost .entry {
display: inline-block;
max-width: 180px;
margin-bottom: 10px;
vertical-align: top;
}

.before-footer-widgets .featuredpost h2 {
font-size: 16px;
}

.daily-dish-home .entry-content p:last-child,
.daily-dish-authorproj .entry-content p:last-child{
margin-bottom: 0;
}

.home-bottom,
.home-middle,
.home-top,
.authorproj-bottom,
.authorproj-middle,
.authorproj-top{
overflow: hidden;
}

.home-middle,
.home-top,
.authorproj-middle,
.authorproj-top{
margin-bottom: 40px;
}

.home-middle .featuredpost .entry{
float: left;
width: 100%;
}

.authorproj-middle .featuredpost .entry{
width: 100%;
}

.featured-content .entry ~ .widget-title {
clear: both;
}

.featured-content .entry ~ .widget-title + ul li {
border: none;
width: 100% !important;
padding: 0;
}

.home-middle .featured-content .alignnone,
.authorproj-middle .featured-content .alignnone{
margin-bottom: 32px;
}

.home-bottom .featured-content .entry-title,
.home-middle .featured-content .entry-title,
.authorproj-bottom .featured-content .entry-title,
.authorproj-middle .featured-content .entry-title{
font-size: 24px;
}

.home-middle .featured-content .entry:nth-of-type(2n+1),
.authorproj-middle .featured-content .entry:nth-of-type(2n+1){
clear: left;
margin-right: 40px;
}

.home-bottom .featured-content .entry,
.authorproj-bottom .featured-content .entry,
.sidebar .featured-content .entry {
border-bottom: 1px dotted #ddd;
}

.sidebar .featured-content .entry:last-child {
margin-bottom: 0;
}

[treenao]

I figured it out! And the fix Porter recommended DID work. I just needed to refresh the cache! Silly me!

[Author]

Posts