customize feedly to use the full screen width (version 6)

Feedly is a magazine style RSS reader which is built on top of Google Reader. So If you do use Feedly as your preferred RSS and news reader and if you have one of the wide screen monitors, you must have noticed that the Feedly GUI does not stretch fully to make complete use of all the screen real estate.

Actually Feedly provides three options in Preferences, to set the navigation layout to a top navigation style which is optimized for a 1024 pixel layout and a left navigation style which is optimized for 1180 pixel and more. It also has a automatic layout option which is supposed to optimize to the width of the window. None of these options worked well in my case and the automatic layout seems to be the same as the left navigation layout in my case.

Feedly Screenshot

You can use some CSS magic to stretch the layout to completely fit your screen and use all of the screen space. The code below is the CSS that you can copy and paste to change the layout.

UPDATE :  There is later version of Feedly which needs a slightly different version of the CSS. See the css code for version 8 of Feedly.

Update: Updating the code below to work with the latest version of Feedly  which version 6.0.401

div#feedlyFrame { width : 96% !important;}
div#feedlyPart0 {
width : 90% !important;
margin-left:10% !important;
}
div#feedlyPart { width : 79% !important;}
div#feedlyPage, div#mainArea { width: 100% !important;}
div#sideArea { width : 210px !important;}
.u4Entry, .u100Entry {
width:100% !important;
max-width: 100% !important;
}
.inlineFrameHolder, .inlineFrame, .selectedEntry, .entryBody {
width:100% !important;
max-width: 100% !important;
font-size: 12px !important;
}
.entryHolder {
width:99% !important;
max-width: 100% !important;
}
.area { margin-left:100px !important }

If your Feedly screen looked something like this before

Feedly Explore Page Screenshot

Feedly Article View Screenshot

then it should look like this after you have applied the CSS to the page.

Feedly wide screen screenshot

Feedly wide screen screenshot

Feedly has an extension for both Chrome and Firefox, and this code should work on both of them. You will need to add this CSS code directly to your user style sheet in the browser or use the Stylish extension and use it to inject the code. If you are unsure on how exactly to do this, then Refer to How to use a custom user style sheet in your browser.