Changing Outreach Pro Front Page Boxes to 3

[nymills]

I'm working with Outreach Pro. Currently it's template is set to 4 home page widget boxes. How can I change that to 3 boxes and change the size of them? Thanks!!

[Brad Dalton]

Inspect the boxes using a browser app like Firebug or Chrome Inspector and find the CSS.

You can then find the classes in your style.css file and change the code

Or you could find the classes generated by the PHP code in the front-page.php file and then find the CSS in your style sheet.

Around line 1375 is this CSS you can modify:

.home-bottom .widget {
	float: left;
	margin-left: 2.564102564102564%;
	width: 23.076923076923077%;
}

.home-bottom .widget:nth-child(4n+1) {
	clear: both;
	margin-left: 0;
}

To something like this ( Untested )

.home-bottom .widget {
	float: left;
	margin-left: 1.5%;
	width: 32%;
}

.home-bottom .widget:nth-child(3n+1) {
	clear: both;
	margin-left: 0;
}

The values for these 2 properties need to be modified:

        margin-left: 1.5%;
	width: 32%;

---

Tutorials for StudioPress Themes.

[Author]

Posts