How Can We Help?

Search for answers or browse our knowledge base.

< All Topics
Print

How to adjust the width of the post content and post media container in Full Width layout?

Default media and container width is 50%. The following CSS snippet will change the media container width to 1/4 and post content to 3/5.

@media screen and (min-width: 981px){.et_pb_column_4_4 .et_pb_post_extra.el_dbe_full_width .post-media { width: calc((100% - 120px)/ 4);}.et_pb_column_4_4 .et_pb_post_extra.el_dbe_full_width .post-content { width: calc((100% - 120px)/ 4*3);}}



The following CSS snippet will change the media container width to 1/5 and content to 4/5. This layout is ideal for content with a large excerpt.

@media screen and (min-width: 981px){.et_pb_column_4_4 .et_pb_post_extra.el_dbe_full_width .post-media { width: calc((100% - 120px)/ 5);}.et_pb_column_4_4 .et_pb_post_extra.el_dbe_full_width .post-content { width: calc((100% - 120px)/ 5*4);}}


Previous How to change position of the category in Block Extended layout?
Next Disable animation on hover in Block Extended Layout