Survey Solutions

Support portal and knowledge base

Example Page (Don't delete me, please)

Last Updated: Mar 06, 2017 03:11PM EST

Attention! A formatting of the article in the editor differs from it's look on the website

Examples of using classes

Code

Default code

To add a code to the page please wrap the text within the tag
<pre>some codes<⁄pre>
. The information appears without any formatting with saving all spaces and default styles which were used. The code takes the entire width of a string. Because our editor doesn't perceive Special Characters , please replace them on special code.

Example:

self==enterprises_13g-enterprises_13h && self == (enterprises_13c - enterprises_13f)

The code in the middle of a string

If you would like that your code took less space and was in the middle of a string you should add special class to your tag <pre>
<pre class=“part-of-row”>some codes<⁄pre>
and place it inside the tag div with class text-center
<pre class=“text-center”><pre class=“part-of-row”>some codes<⁄pre><⁄pre>

Example:

enterprises_13g!=0 && enterprises_13d!=enterprises_13a

The code inside a text

If it necessary to place some piece of code inside the text (example:
enterprises_13d!=0
) you should wrap the text in tag div with class contains-element and assign class part-of-row to your pre tag.
<pre class=“contains-element”><pre class=“part-of-row”>some codes<⁄pre><⁄pre>

Images

A few images together

You can align the image on the left, right edge or center. By default all images will align in line if they go one after another and placed in size. You can add link to your images and resize it after sending the image to the server.

Example:

One image in row

If it necessary to place only one image in row, add to the image class one-in-raw on special sheet

Example:

The image on the middle

By the way, you can also align it on the middle by adding second class center

Example:

The image on right side

If you need to align the image by right side you should place it inside tag div with class clear after that add class right to the image.

Example:

Each image with class right Example:

Each image with class left Example:

Image with class left and right. Example:

Floating images

If you have a lot of text and need that the text floats around the image you should place whole this text and image inside tag div with class clear, and place only text in tag p, and after add class to the image, which depends on the side you need. left or right. The image should be before text.

Example:

Lorem ipsum dolor sit amet, consectetur adipiscing elit. Proin dapibus dolor quis felis condimentum gravida. Suspendisse condimentum, ligula a pretium sollicitudin, nunc urna commodo felis, quis mattis felis tortor sit amet nisi. Morbi dolor lorem, accumsan id nibh vitae, dapibus dignissim magna. Suspendisse malesuada placerat lobortis. Vivamus augue lacus, sodales nec sagittis a, dictum eu felis. Phasellus tincidunt viverra risus et viverra. Donec euismod ligula a dictum pellentesque. Aenean vel lorem sodales, viverra nisi ut, posuere nunc. Aenean lobortis vitae ligula non laoreet. Nullam placerat diam id felis tempus venenatis.

Curabitur laoreet sollicitudin libero non efficitur. Proin et nunc quis elit sollicitudin fringilla ut vel ex. Donec sit amet leo sit amet nibh fermentum suscipit interdum non nibh. Cum sociis natoque penatibus et magnis dis parturient montes, nascetur ridiculus mus. Donec eros quam, pretium ut sapien at, ultrices pretium risus. Fusce pellentesque nibh non enim rhoncus rutrum. Lorem ipsum dolor sit amet, consectetur adipiscing elit. Quisque condimentum enim quam, vel pulvinar tellus ullamcorper id. Phasellus sagittis leo sollicitudin feugiat iaculis. Vestibulum nec hendrerit nunc, molestie porta augue. Mauris vulplaceate purus ut tempor auctor. Nunc imperdiet nisi vel dolor facilisis, non consectetur neque cursus. Sed lacinia blandit pharetra. Curabitur imperdiet quis justo eget ultrices. Sed bibendum, purus ac tristique fringilla, metus elit ullamcorper tellus, vulplaceate tempus turpis nibh at magna. Vestibulum ornare lacus eu vulplaceate finibus. Ut faucibus diam pharetra lacus pulvinar convallis. Suspendisse convallis lectus tempus commodo auctor. Pellentesque lacinia lorem in purus placerat varius.

Example:

Lorem ipsum dolor sit amet, consectetur adipiscing elit. Proin dapibus dolor quis felis condimentum gravida. Suspendisse condimentum, ligula a pretium sollicitudin, nunc urna commodo felis, quis mattis felis tortor sit amet nisi. Morbi dolor lorem, accumsan id nibh vitae, dapibus dignissim magna. Suspendisse malesuada placerat lobortis. Vivamus augue lacus, sodales nec sagittis a, dictum eu felis. Phasellus tincidunt viverra risus et viverra. Donec euismod ligula a dictum pellentesque. Aenean vel lorem sodales, viverra nisi ut, posuere nunc. Aenean lobortis vitae ligula non laoreet. Nullam placerat diam id felis tempus venenatis.

Curabitur laoreet sollicitudin libero non efficitur. Proin et nunc quis elit sollicitudin fringilla ut vel ex. Donec sit amet leo sit amet nibh fermentum suscipit interdum non nibh. Cum sociis natoque penatibus et magnis dis parturient montes, nascetur ridiculus mus. Donec eros quam, pretium ut sapien at, ultrices pretium risus. Fusce pellentesque nibh non enim rhoncus rutrum. Lorem ipsum dolor sit amet, consectetur adipiscing elit. Quisque condimentum enim quam, vel pulvinar tellus ullamcorper id. Phasellus sagittis leo sollicitudin feugiat iaculis. Vestibulum nec hendrerit nunc, molestie porta augue. Mauris vulplaceate purus ut tempor auctor. Nunc imperdiet nisi vel dolor facilisis, non consectetur neque cursus. Sed lacinia blandit pharetra. Curabitur imperdiet quis justo eget ultrices. Sed bibendum, purus ac tristique fringilla, metus elit ullamcorper tellus, vulplaceate tempus turpis nibh at magna. Vestibulum ornare lacus eu vulplaceate finibus. Ut faucibus diam pharetra lacus pulvinar convallis. Suspendisse convallis lectus tempus commodo auctor. Pellentesque lacinia lorem in purus placerat varius.

Example:

Lorem ipsum dolor sit amet, consectetur adipiscing elit. Proin dapibus dolor quis felis condimentum gravida. Suspendisse condimentum, ligula a pretium sollicitudin, nunc urna commodo felis, quis mattis felis tortor sit amet nisi. Morbi dolor lorem, accumsan id nibh vitae, dapibus dignissim magna. Suspendisse malesuada placerat lobortis. Vivamus augue lacus, sodales nec sagittis a, dictum eu felis. Phasellus tincidunt viverra risus et viverra. Donec euismod ligula a dictum pellentesque. Aenean vel lorem sodales, viverra nisi ut, posuere nunc. Aenean lobortis vitae ligula non laoreet. Nullam placerat diam id felis tempus venenatis.

Curabitur laoreet sollicitudin libero non efficitur. Proin et nunc quis elit sollicitudin fringilla ut vel ex. Donec sit amet leo sit amet nibh fermentum suscipit interdum non nibh. Cum sociis natoque penatibus et magnis dis parturient montes, nascetur ridiculus mus. Donec eros quam, pretium ut sapien at, ultrices pretium risus. Fusce pellentesque nibh non enim rhoncus rutrum. Lorem ipsum dolor sit amet, consectetur adipiscing elit. Quisque condimentum enim quam, vel pulvinar tellus ullamcorper id. Phasellus sagittis leo sollicitudin feugiat iaculis. Vestibulum nec hendrerit nunc, molestie porta augue. Mauris vulplaceate purus ut tempor auctor. Nunc imperdiet nisi vel dolor facilisis, non consectetur neque cursus. Sed lacinia blandit pharetra. Curabitur imperdiet quis justo eget ultrices. Sed bibendum, purus ac tristique fringilla, metus elit ullamcorper tellus, vulplaceate tempus turpis nibh at magna. Vestibulum ornare lacus eu vulplaceate finibus. Ut faucibus diam pharetra lacus pulvinar convallis. Suspendisse convallis lectus tempus commodo auctor. Pellentesque lacinia lorem in purus placerat varius.

Tables

Default tables

When you create table you can choose amount of rows, columns and choose header. By default table width is 500px

Example:

Company Contact Country
Alfreds Futterkiste Maria Anders Germany
Centro comercial Moctezuma Francisco Chang Mexico
Ernst Roland Austria
island Trading helen Bennet UK
Laughing Bacchus Winecellars Yoshi Tannamuri Canada
Magazzini  Giovanni Rovelli Italy

Table with borders

To add borders and highlight the title add class table_with_border to the table

Example:

Company Contact Country
Alfreds Futterkiste Maria Anders Germany
Centro comercial Moctezuma Francisco Chang Mexico
Ernst Roland Austria
island Trading helen Bennet UK
Laughing Bacchus Winecellars Yoshi Tannamuri Canada
Magazzini  Giovanni Rovelli Italy

Table with striped rows and borders

Use class table-striped to add zebra-striping to any table row and class table_with_border to add borders

Example:

Company Contact Country
Alfreds Futterkiste Maria Anders Germany
Centro comercial Moctezuma Francisco Chang Mexico
Ernst Roland Austria
island Trading helen Bennet UK
Laughing Bacchus Winecellars Yoshi Tannamuri Canada
Magazzini  Giovanni Rovelli Italy

The table on the middle

Use class center to place the table on the middle

Example:

Company Contact Country
Alfreds Futterkiste Maria Anders Germany
Centro comercial Moctezuma Francisco Chang Mexico
Ernst Roland Austria
island Trading helen Bennet UK
Laughing Bacchus Winecellars Yoshi Tannamuri Canada
Magazzini  Giovanni Rovelli Italy

The table on right side

The same as with images, if you need to align the table by right side you should place it inside tag div with class clear after that add class right to the table.

Example:

Company Contact Country
Alfreds Futterkiste Maria Anders Germany
Centro comercial Moctezuma Francisco Chang Mexico
Ernst Roland Austria
island Trading helen Bennet UK
Laughing Bacchus Winecellars Yoshi Tannamuri Canada
Magazzini  Giovanni Rovelli Italy

Each table with class right Example:

Company Contact Country
Alfreds Futterkiste Maria Anders Germany
Centro comercial Moctezuma Francisco Chang Mexico
Ernst Roland Austria
island Trading helen Bennet UK
Laughing Bacchus Winecellars Yoshi Tannamuri Canada
Magazzini  Giovanni Rovelli Italy
Company Contact Country
Alfreds Futterkiste Maria Anders Germany
Centro comercial Moctezuma Francisco Chang Mexico
Ernst Roland Austria
island Trading helen Bennet UK
Laughing Bacchus Winecellars Yoshi Tannamuri Canada
Magazzini  Giovanni Rovelli Italy

Each table with class left Example:

Company Contact Country
Alfreds Futterkiste Maria Anders Germany
Centro comercial Moctezuma Francisco Chang Mexico
Ernst Roland Austria
island Trading helen Bennet UK
Laughing Bacchus Winecellars Yoshi Tannamuri Canada
Magazzini  Giovanni Rovelli Italy
Company Contact Country
Alfreds Futterkiste Maria Anders Germany
Centro comercial Moctezuma Francisco Chang Mexico
Ernst Roland Austria
island Trading helen Bennet UK
Laughing Bacchus Winecellars Yoshi Tannamuri Canada
Magazzini  Giovanni Rovelli Italy

Table with class left and right. Example:

Company Contact Country
Alfreds Futterkiste Maria Anders Germany
Centro comercial Moctezuma Francisco Chang Mexico
Ernst Roland Austria
island Trading helen Bennet UK
Laughing Bacchus Winecellars Yoshi Tannamuri Canada
Magazzini  Giovanni Rovelli Italy
Company Contact Country
Alfreds Futterkiste Maria Anders Germany
Centro comercial Moctezuma Francisco Chang Mexico
Ernst Roland Austria
island Trading helen Bennet UK
Laughing Bacchus Winecellars Yoshi Tannamuri Canada
Magazzini  Giovanni Rovelli Italy

Floating tables

The same as with images, place whole text and table inside tag div with class clear, and place only text in tag p, and after add class to the table, which depends on the side you need. left or right. The table should be before text.

Example:

Company Contact Country
Alfreds Futterkiste Maria Anders Germany
Centro comercial Moctezuma Francisco Chang Mexico
Ernst Roland Austria
island Trading helen Bennet UK
Laughing Bacchus Winecellars Yoshi Tannamuri Canada
Magazzini  Giovanni Rovelli Italy

Lorem ipsum dolor sit amet, consectetur adipiscing elit. Proin dapibus dolor quis felis condimentum gravida. Suspendisse condimentum, ligula a pretium sollicitudin, nunc urna commodo felis, quis mattis felis tortor sit amet nisi. Morbi dolor lorem, accumsan id nibh vitae, dapibus dignissim magna. Suspendisse malesuada placerat lobortis. Vivamus augue lacus, sodales nec sagittis a, dictum eu felis. Phasellus tincidunt viverra risus et viverra. Donec euismod ligula a dictum pellentesque. Aenean vel lorem sodales, viverra nisi ut, posuere nunc. Aenean lobortis vitae ligula non laoreet. Nullam placerat diam id felis tempus venenatis.

Curabitur laoreet sollicitudin libero non efficitur. Proin et nunc quis elit sollicitudin fringilla ut vel ex. Donec sit amet leo sit amet nibh fermentum suscipit interdum non nibh. Cum sociis natoque penatibus et magnis dis parturient montes, nascetur ridiculus mus. Donec eros quam, pretium ut sapien at, ultrices pretium risus. Fusce pellentesque nibh non enim rhoncus rutrum. Lorem ipsum dolor sit amet, consectetur adipiscing elit. Quisque condimentum enim quam, vel pulvinar tellus ullamcorper id. Phasellus sagittis leo sollicitudin feugiat iaculis. Vestibulum nec hendrerit nunc, molestie porta augue. Mauris vulplaceate purus ut tempor auctor. Nunc imperdiet nisi vel dolor facilisis, non consectetur neque cursus. Sed lacinia blandit pharetra. Curabitur imperdiet quis justo eget ultrices. Sed bibendum, purus ac tristique fringilla, metus elit ullamcorper tellus, vulplaceate tempus turpis nibh at magna. Vestibulum ornare lacus eu vulplaceate finibus. Ut faucibus diam pharetra lacus pulvinar convallis. Suspendisse convallis lectus tempus commodo auctor. Pellentesque lacinia lorem in purus placerat varius.

Example:

Company Contact Country
Alfreds Futterkiste Maria Anders Germany
Centro comercial Moctezuma Francisco Chang Mexico
Ernst Roland Austria
island Trading helen Bennet UK
Laughing Bacchus Winecellars Yoshi Tannamuri Canada
Magazzini  Giovanni Rovelli Italy

Lorem ipsum dolor sit amet, consectetur adipiscing elit. Proin dapibus dolor quis felis condimentum gravida. Suspendisse condimentum, ligula a pretium sollicitudin, nunc urna commodo felis, quis mattis felis tortor sit amet nisi. Morbi dolor lorem, accumsan id nibh vitae, dapibus dignissim magna. Suspendisse malesuada placerat lobortis. Vivamus augue lacus, sodales nec sagittis a, dictum eu felis. Phasellus tincidunt viverra risus et viverra. Donec euismod ligula a dictum pellentesque. Aenean vel lorem sodales, viverra nisi ut, posuere nunc. Aenean lobortis vitae ligula non laoreet. Nullam placerat diam id felis tempus venenatis.

Curabitur laoreet sollicitudin libero non efficitur. Proin et nunc quis elit sollicitudin fringilla ut vel ex. Donec sit amet leo sit amet nibh fermentum suscipit interdum non nibh. Cum sociis natoque penatibus et magnis dis parturient montes, nascetur ridiculus mus. Donec eros quam, pretium ut sapien at, ultrices pretium risus. Fusce pellentesque nibh non enim rhoncus rutrum. Lorem ipsum dolor sit amet, consectetur adipiscing elit. Quisque condimentum enim quam, vel pulvinar tellus ullamcorper id. Phasellus sagittis leo sollicitudin feugiat iaculis. Vestibulum nec hendrerit nunc, molestie porta augue. Mauris vulplaceate purus ut tempor auctor. Nunc imperdiet nisi vel dolor facilisis, non consectetur neque cursus. Sed lacinia blandit pharetra. Curabitur imperdiet quis justo eget ultrices. Sed bibendum, purus ac tristique fringilla, metus elit ullamcorper tellus, vulplaceate tempus turpis nibh at magna. Vestibulum ornare lacus eu vulplaceate finibus. Ut faucibus diam pharetra lacus pulvinar convallis. Suspendisse convallis lectus tempus commodo auctor. Pellentesque lacinia lorem in purus placerat varius.

Example:

Company Contact Country
Alfreds Futterkiste Maria Anders Germany
Centro comercial Moctezuma Francisco Chang Mexico
Ernst Roland Austria
island Trading helen Bennet UK
Laughing Bacchus Winecellars Yoshi Tannamuri Canada
Magazzini  Giovanni Rovelli Italy
Company Contact Country
Alfreds Futterkiste Maria Anders Germany
Centro comercial Moctezuma Francisco Chang Mexico
Ernst Roland Austria
island Trading helen Bennet UK
Laughing Bacchus Winecellars Yoshi Tannamuri Canada
Magazzini  Giovanni Rovelli Italy

Lorem ipsum dolor sit amet, consectetur adipiscing elit. Proin dapibus dolor quis felis condimentum gravida. Suspendisse condimentum, ligula a pretium sollicitudin, nunc urna commodo felis, quis mattis felis tortor sit amet nisi. Morbi dolor lorem, accumsan id nibh vitae, dapibus dignissim magna. Suspendisse malesuada placerat lobortis. Vivamus augue lacus, sodales nec sagittis a, dictum eu felis. Phasellus tincidunt viverra risus et viverra. Donec euismod ligula a dictum pellentesque. Aenean vel lorem sodales, viverra nisi ut, posuere nunc. Aenean lobortis vitae ligula non laoreet. Nullam placerat diam id felis tempus venenatis.

Curabitur laoreet sollicitudin libero non efficitur. Proin et nunc quis elit sollicitudin fringilla ut vel ex. Donec sit amet leo sit amet nibh fermentum suscipit interdum non nibh. Cum sociis natoque penatibus et magnis dis parturient montes, nascetur ridiculus mus. Donec eros quam, pretium ut sapien at, ultrices pretium risus. Fusce pellentesque nibh non enim rhoncus rutrum. Lorem ipsum dolor sit amet, consectetur adipiscing elit. Quisque condimentum enim quam, vel pulvinar tellus ullamcorper id. Phasellus sagittis leo sollicitudin feugiat iaculis. Vestibulum nec hendrerit nunc, molestie porta augue. Mauris vulplaceate purus ut tempor auctor. Nunc imperdiet nisi vel dolor facilisis, non consectetur neque cursus. Sed lacinia blandit pharetra. Curabitur imperdiet quis justo eget ultrices. Sed bibendum, purus ac tristique fringilla, metus elit ullamcorper tellus, vulplaceate tempus turpis nibh at magna. Vestibulum ornare lacus eu vulplaceate finibus. Ut faucibus diam pharetra lacus pulvinar convallis. Suspendisse convallis lectus tempus commodo auctor. Pellentesque lacinia lorem in purus placerat varius.

support@mysurvey.solutions
http://assets3.desk.com/
false
desk
Loading
seconds ago
a minute ago
minutes ago
an hour ago
hours ago
a day ago
days ago
about
false
Invalid characters found
/customer/en/portal/articles/autocomplete