How to add angle to middle of body layout

[mpet29]

I’m trying to build out a site that has a top part like the image attached. The left-corner 45 degree angle isn’t that hard to implement, but what’s getting me is the “middle” angle. I’m having a hard time finding a way to do that, largely because I’m not necessarily sure what to call it, which limits my searching ability. Anyone seen a site that has done that, or has a good tip on how?

http://imgur.com/LpCDqIP

[Paulie_D]

Is that just a ‘style’ element or will it be holding actual content?

Will only the top have those shapes or are you planning on something similar at the bottom?

[mpet29]

Similar, but not identical, at the bottom.

Here it is again with the actual content included. I already have that in place, just need to modify the border around it.

http://imgur.com/q1bJpi5

[Paulie_D]

Perhaps you could show us where you are with a Codepen.io example?

[mpet29]

Thanks — I’m not familiar with codepen though, and I’m not sure how I’d put a whole site (which isn’t public yet) in there anyway.

It’s just a basic wordpress site, based off of http://my.studiopress.com/themes/genesis/#demo-full

[Paulie_D]

Without knowing the html structure it’s hard to offer much in the way of constructive help.

Certainly pseudo elements could manage the triangles/angles but where to apply them will require knowledge of the structure.

You don’t have to post the whole site to codepen, in fact, its much better if you don’t.

Just show enough HTML & CSS to demonstrate the structure and the problem.

[Author]

Posts