Styling Compatibility
Make Sure Your Styles are Compatible with Layouts
If your site has modified the base width of the page – the defaults being 990px for the page, and 670px for the content area, you may have to customize the widths of the various layouts column sizes. If using the default page and content widths are not an option, you may wish to override the layout column size classes as follows in your site’s stylesheets:
/* full width column. */
body.layout_detail div.column_lead { width: <content area width>px; margin-right: 0; }
/* 2/3 width column. */
body.layout_detail div.column_large { width: <content area width * 2/3 - 10>px; }
/* 1/2 width column. */
body.layout_detail div.column_medium { width: <content area width * 1/2 - 10>px; }
/* 1/3 width column. */
body.layout_detail div.column_small { width: <content area width * 1/3 - 20>px; }
/* sidebar column. */
body.layout_detail .sidebar div.column { width: <sidebar width>px; }
body.layout_detail .sidebar div.column img { max-width: <sidebar width>px; }
Click to copy
You may need to adjust the pixel widths further if your site applies different padding or borders to layout columns.
0 Comments
Add your comment