Maximizing Blog Post Width

Question

I have been trying to maximize the blog post width to fill the web part, but I could only edit the width of the web part. I have tried adding Content Editor and Script Editor to add an html code to maximize the Posts web part but nothing changed. How do I get the blog posts to fill the whole web part?

Answer 1

The problem is Msft is clueless about design and never fixes their glaringly obvious mistakes. In this case, they are still using archaic tables to render page layouts which is something no one else has been doing for years. Even the humblest self respecting designer or developer would NEVER allow something like this out into production but Msft simply doesn't care.

I use bootstrap to better manage the responsiveness and look of blog pages, but to widen the post area you could probably get away with this styling:

table.ms-blog-MainArea, ul.ms-blog-postList {max-width:none !important;}

You may have to inspect the post area (using a browser inspector) to see if any other elements are constraining the width. Why Msft hasn't fixed this after so may years is beyond me.

Answer 2

Useless voice is for feature requests, not to fix coding mistakes which this clearly is. This would probably take a competent developer 10 minutes to fix. Why hasn't that been done yet?

Answer 3

Hi tspraggins,

Really sorry for your inconvenience.

My ability is limited and I'm also not able to change the width of box with script editor and SharePoint designer.

Maybe you can try the method provided by webbrewers3 by your side.

I suggest you sharing your experience in SharePoint uservoice to give feedback to design team.

Regards,

Eric

Answer 4

Hi Eric,

Thanks for your reply. Such a bummer that we can't easily fill the width of the web part. Even after switching over to basic, the post width remains the same just without the box borders (picture below). There's still a lot of white space from the posts to the blog tools. https://learn-attachment.microsoft.com/api/attachments/b8e689ee-e98d-4c98-9de9-cc2fde3e6552?platform=QnA"https://learn-attachment.microsoft.com/api/attachments/b8e689ee-e98d-4c98-9de9-cc2fde3e6552?platform=QnA" rel="ugc nofollow">

I followed the script in this article: http://sharepointtreats.blogspot.com/2015/08/making-sharepoint-blog-full-width.html

.ms-blog-MainArea {max-width:none;}

.ms-blog-postList {max-width:none;}

.ms-blog-MainArea>tbody>tr>td{width:100%;}

and also tried this https://blog.crsw.com/2006/07/31/how-to-change-the-width-of-a-sharepoint-blog/

<style type=”text/css”>

.ms-PostWrapper,.ms-CommentsWrapper,.ms-blogrss

{

   color:#4c4c4c;

   width:100%;

}

</style>

Thanks in advance for any insight you can provide!

Answer 5

Hi tspraggins,

It seem like an impossible mission, because I have already use SharePoint Designer to see if there are some scripts to control the size of box.

I know what you want, because I notice there is a blank area on right side in a new Blog site as below picture shows.

 If you want to fill the web part, I suggest you changing post layout to Basic.

 Maybe you can share me scripts you write in Script Editor to give me more thought.

Sorry for your inconvenience.

Regards,

Eric