{% extends "admin/base_site.html" %} {% load i18n %} {% block bodyclass %}grp-doc{% endblock %} {% block content-class %}{% endblock %} {% block title %}Grappelli Documentation » >Predefined Layouts{% endblock %} {% block breadcrumbs %} {% endblock %} {% block content %}

Predefined Layouts

There are several predefined layouts based on the grid system Grappelli uses.

Layout 2-Columns: Fixed & Fluid

The layout with the class .l-2c-fluid contains two child columns: The column .c-1 has a fixed width and the column .c-2 a fluid width. By adding .l-d-# to the layout class, you define the number of columns for .c-1.

.c-1

.c-2

.c-1

.c-2

{% filter force_escape %}
...
...
...
...
{% endfilter %}

Reverse this Layout

It is easy to reverse this layout: If you want to switch the order of the columns, just change the layout class to .l-2cr-fluid.

.c-1

.c-2

.c-1

.c-2

{% filter force_escape %}
...
...
...
...
{% endfilter %}

Use this Layout inside a Grid

You may also use this layout within a grid container or grid-based columns: Just put the layout .l-2c-fluid (or the reversed .l-2cr-fluid) inside a .g-d-#.

.c-1

.c-2

.c-1

.c-2

{% filter force_escape %}
...
...
...
...
{% endfilter %}
{% endblock %}