2018.1

Table Of Contents

.page_mediabox img.ol_pdf_datamapper_input {

z-index: 10 !important;

}

Scaling the section background

The rule below downscales the section background image and keeps it in the centre of the

page:

.page_mediabox img.ol_pdf_datamapper_input {

transform: translate(-50%, -50%) scale(1.5, 1.5) !important;

}

View selectors

In the Designer, sections can be viewed on different tabs: Source, Design, Preview and - if it is

a Web section - Live. In each view mode (except Source) a specific CSS class is added to the

<html> element. The view-specific classes are:

l .DESIGN

l .PREVIEW

l .OUTPUT

.OUTPUTis used when viewing the current section on the Live tab or in an external browser,

and when generating output.

View selectors allow you to apply formatting to elements in a certain view, for example to

highlight or show elements. The Designer itself does this, for example, to highlight all boxes in

the Design view, when the Show Edges icon is clicked.

Adding an outline

The following style rule wraps every element that has the class address-block with a purple

dashed outline in Design mode. The outline is not visible in other views or when outputting the

document.

.DESIGN .address-block {

outline: 1px dashed purple;

}

Page 364