WwGallery on DeviantArthttps://www.deviantart.com/wwgallery/art/Content-Holder-Boxes-with-background-478515906WwGallery

Deviation Actions

WwGallery's avatar

Content-Holder Boxes with background

By
WwGallery
Published:
8.7K Views

Description


Hello I found a way to add a background to the Content-Holder Boxes + Border  :D


Background gadget + Content - Holder Boxes with background Non-Rounded + Border (with header title)

<div class="popup2-moremenu"><div class="floaty-boat"><img src="Here the URL of your background gadget"/></div></div>

<div class="gr-top"></div><div class="gr-body"><div align="center"><div class="popup2-moremenu"><div class="floaty-boat"><img src="Here the URL of your background Content-Holder"/></div></div><div class="gr-box gr-genericbox"><br/><h3>CONTENT HEADING HERE</h3>Body text here..Body text here..Body text here..Body text here..Body text here..
Body text here..Body text here..Body text here..Body text here..Body text here..
Body text here..Body text here..Body text here..Body text here..Body text here..
Body text here..Body text here..Body text here..Body text here..Body text here..</div><div class="gr-top"></div></div></div></div><br/><br/>


Background gadget + Content - Holder Boxes with background Non-Rounded + Border (without header title)

<div class="popup2-moremenu"><div class="floaty-boat"><img src="Here the URL of your background gadget"/></div></div>

<div class="gr-top"></div><div class="gr-body"><div align="center"><div class="popup2-moremenu"><div class="floaty-boat"><img src="Here the URL of your background Content-Holder"/></div></div><div class="gr-box gr-genericbox"><br/>Body text here..Body text here..Body text here..Body text here..Body text here..
Body text here..Body text here..Body text here..Body text here..Body text here..
Body text here..Body text here..Body text here..Body text here..Body text here..
Body text here..Body text here..Body text here..Body text here..Body text here..</div><div class="gr-top"></div></div></div></div><br/><br/>





Background gadget + Content - Holder Boxes with background Rounded + Border (with header title)

<div class="popup2-moremenu"><div class="floaty-boat"><img src="Here the URL of your background gadget"/></div></div>

<div class="ccomment ccomment-featured"><div class="ch-ctrl"><div class="ch-ctrl cc-in" align="center"><div class="popup2-moremenu"><div class="floaty-boat"><img src="Here the URL of your background Content-Holder"/></div></div><div class="gr-box gr-genericbox"><br/><h3>CONTENT HEADING HERE</h3>Body text here..Body text here..Body text here..Body text here..Body text here..
Body text here..Body text here..Body text here..Body text here..Body text here..
Body text here..Body text here..Body text here..Body text here..Body text here..
Body text here..Body text here..Body text here..Body text here..Body text here..Body text here..Body text here..Body text here..Body text here..Body text here..</div></div></div></div><br/><br/>


Background gadget + Content - Holder Boxes with background Rounded + Border (without header title)

<div class="popup2-moremenu"><div class="floaty-boat"><img src="Here the URL of your background gadget"/></div></div>

<div class="ccomment ccomment-featured"><div class="ch-ctrl"><div class="ch-ctrl cc-in" align="center"><div class="popup2-moremenu"><div class="floaty-boat"><img src="Here the URL of your background Content-Holder"/></div></div><div class="gr-box gr-genericbox"><br/>Body text here..Body text here..Body text here..Body text here..Body text here..
Body text here..Body text here..Body text here..Body text here..Body text here..
Body text here..Body text here..Body text here..Body text here..Body text here..
Body text here..Body text here..Body text here..Body text here..Body text here..Body text here..Body text here..Body text here..Body text here..Body text here..</div></div></div></div><br/><br/>


Your background Content-Holder should have sizes:

Exactly width - 386 px
Height max 1500 px - depends on the length of the content gadget

Your background gadgets should have sizes:

Width  - 800 px (recommended)
Height max 1500 px - depends on the length of the content gadget


Big thanks to Alexandra  :iconuszatyarbuz: for an idea as to the Rounded + Border
Image size
651x1167px 331.87 KB
© 2014 - 2024 WwGallery
Comments22
Join the community to add your comment. Already a deviant? Log In
Demiilia's avatar
Demiilia
This worked! Thanks so much :D