Feature Block 10

CSS Style: featureBlock10 and a custom background (see below)

Best for header graphics which you want to have linkable or want text over an image.  The bottom of the image will be automatically darkened and text is positioned at the bottom.

Recommended Element Layout:

  • Header 1, 2, or 3 - title your content with something short and relevant
  • Small amount of text, you can use hyper links
  • images within content not recommended

You are required to have additional css styles for the background images.  Use the example css block below for reference.  Background images are for decorative purposes only and can not be used to convey directions, event date/time information, or any other key information that is not also included in the text on the page.

 

Oranges in bloom

Using a background image with h350 for the height

 

Welcome To CSUF

This image should be set as image cover, by default it will try and strech the image 100% wide and 100% high.  Uses h200 to set the height.

 

Night time at CSUF

background style here is set to cover to correct image size.  H150 to set the height.

setting up additional css for background images

These would be included in your _MyOverride_Style.css file.  OmniUpdate users will include these classes on their page properties when setting up the feature block 10 style.

starting in version 4.0.953c you only need the background-image defined.

.featureBG<number>
{
  background-image: url(../images/<some folder name>/<image file goes here>); 
}

optional elements can include: (you need to create the value for these settings)

  • background-repeat
  • background-position
  • background-size  * use this setting if your images are streched