1602 1535 bas.jacobs
Blog Posts
Simple Web Part :before :after example

I made this little fun :before :after CSS example for SharePoint 2013 Web Parts. Have fun branding your SharePoint solutions!

[fancy_box]

/*Web Part Styling*/

#DeltaPlaceHolderMain .ms-webpart-chrome-fullWidth:before {
background:url(‘grass.png’) top left;
content: ” “;
display: block;
position: relative;
height: 100px;
}

#DeltaPlaceHolderMain .ms-webpart-chrome-fullWidth:after {
background:url(‘roots.png’) bottom left no-repeat;
content: ” “;
display: block;
position: relative;
height: 125px;
}

[/fancy_box]

Edit mode:

[fancy_box]

beforeafteredit[/fancy_box]

View mode:

[fancy_box]

beforeafterview[/fancy_box]

Comments - No Responses to “Simple Web Part :before :after example”

Sure is empty down here...

Leave a Reply




HTML5 Accepted Tags: <a href="" title=""> <abbr title=""> <acronym title=""> <b> <blockquote cite=""> <cite> <code> <del datetime=""> <em> <i> <q cite=""> <s> <strike> <strong>