To the start page
  • Deutsch
  • Search
  • Login
What is the difference between "Tiles" and "Squares"
To the start page (c) Alkacon Software Gmbh & Co. KG
  • Service Links
    • Deutsch
    • Search
    • Login
  • Mercury Demo EN
    • Home
    • About
    • The team
    • FAQs
    • Our clients
    • Blog
      • Blog articles
      • Post a new article
    • Events
    • Content elements
      • Content section 
        • Text display
        • Image display
        • Image / text flipping cards
        • Icon box display
      • Article 
        • Article vs. Content Section
        • Article Teaser vs. Detail
        • Article Detail display
      • Decoy
      • Event
      • Image series
      • Media
      • Contact information
      • Location Map / POI
      • FAQ entry
      • Job advertisment
      • Link sequence
      • Slider
    • Advanced elements
      • List 
        • List filters
      • Flexible content
      • Meta info
      • Tabs / Accordion
      • Form
      • Navigation
      • Sitemap
      • Shariff social media
      • Dynamic functions
        • Disqus comments
        • Privacy Policy
    • Template elements
      • Layout row
      • Layout area
      • Layout group
    • Lists
      • Elaborate list
      • Compact list
      • Accordion list
      • Text tile list
      • Masonry list
      • Image tile list
    • Detail pages
      • Article detail
      • Event detail
      • Media detail
      • Imageseries detail
      • FAQ detail
      • Job detail
    • Further Demos
      • Backgrounds
      • Tiles demo
      • Squares demo
      • Real Estate
      • CSS Visualizer
      • Flex Formatters
    • Image series
    • Two columns
    • Three columns
    • Multi-Language
    • Downloads
    • Search
  • DE
    • Startseite
    • Über uns
    • Fragen?
    • Tagebuch
      • Tagebuch Einträge
      • Neuen Eintrag erstellen
    • Mehrsprachig
    • Suche
  • Tutorial
    • Login to OpenCms
    • Step 1: Modify a page
    • Step 2: Edit content
    • Step 3: Fun with Formatters
    • Step 4: Work with the Sitemap
    • Step 5: Launchpad and Explorer
    • Step 6: Publish your changes
    • Start exploring OpenCms
  • Release Notes
    • OpenCms 11.0.2
    • OpenCms 11.0.1
    • OpenCms 11.0.0
    • OpenCms 10.5.4
    • OpenCms 10.5.3
    • OpenCms 10.5.2
    • OpenCms 10.5.1
    • OpenCms 10.5.0
    • OpenCms 10.0.1
    • OpenCms 10.0.0
    • OpenCms 9.5.3
    • OpenCms 9.5.2
    • OpenCms 9.5.1
    • OpenCms 9.5.0
    • OpenCms 9.0.1
    • OpenCms 9.0.0
    • OpenCms 8.5.2
    • OpenCms 8.5.1
    • OpenCms 8.5.0
    • OpenCms 8.0.4
    • OpenCms 8.0.3
    • OpenCms 8.0.2
    • OpenCms 8.0.1
    • OpenCms 8.0.0
    • Installation
    • Mailing list
  • Overview
  • Mercury Demo EN
  • Detail pages
  • FAQ detail
  • What is the difference between "Tiles" and "Squares"

What is the difference between "Tiles" and "Squares"

Tiles use display: flex - Squares use display: block.

TILES are "variable height":

  • Are part of a flex-box row
  • Height of a tile is based on the content / formatter
  • All tiles in a row will have the same height decause of flex
  • If height of tiles on a row is variable, flex will compensate for this

SQUARES require "fixed height":

  • Are not in flex-box row, use traditional box model
  • Usually do "float" left
  • Height must be set in the square itself as fixed height
  • Home
  • About
  • The team
  • FAQs
  • Our clients
  • Blog
    • Blog articles
    • Post a new article
  • Events
  • Content elements
    • Content section 
      • Text display
      • Image display
      • Image / text flipping cards
      • Icon box display
    • Article 
      • Article vs. Content Section
      • Article Teaser vs. Detail
      • Article Detail display
    • Decoy
    • Event
    • Image series
    • Media
    • Contact information
    • Location Map / POI
    • FAQ entry
    • Job advertisment
    • Link sequence
    • Slider
  • Advanced elements
    • List 
      • List filters
    • Flexible content
    • Meta info
    • Tabs / Accordion
    • Form
    • Navigation
    • Sitemap
    • Shariff social media
    • Dynamic functions
      • Disqus comments
      • Privacy Policy
  • Template elements
    • Layout row
    • Layout area
    • Layout group
  • Lists
    • Elaborate list
    • Compact list
    • Accordion list
    • Text tile list
    • Masonry list
    • Image tile list
  • Detail pages
    • Article detail
    • Event detail
    • Media detail
    • Imageseries detail
    • FAQ detail
    • Job detail
  • Further Demos
    • Backgrounds
    • Tiles demo
    • Squares demo
    • Real Estate
    • CSS Visualizer
    • Flex Formatters
  • Image series
  • Two columns
  • Three columns
  • Multi-Language
  • Downloads
  • Search

About OpenCms

OpenCms from Alkacon Software is a professional, easy to use website content management system. OpenCms helps content managers worldwide to create beautiful websites fast and efficiently.

More information

OpenCms Documentation Central
Tutorials and HowTos for OpenCms.

OpenCms Services by Alkacon Software
Alkacon Software's focus area is to develop OpenCms extensions and provide professional support for OpenCms projects.

The OpenCms mailing list

The opencms-dev mailing list is the place for all questions, comments and suggestions for OpenCms and the main forum of the OpenCms community. Subscribe to the list by filling out the following form.

Contact us

Alkacon Software

An der Wachsfabrik 13
50996 Cologne
NRW Germany
Phone:+49 2236 / 3826-0
Send us an email
Download vCard

Stay connected

  • OpenCms on Facebook
  • OpenCms on Twitter
  • OpenCms on Xing
  • OpenCms on SlideShare
  • OpenCms on YouTube
  • OpenCms source code on GitHub
  • OpenCms RSS News Feed
Built with OpenCms 11
© Alkacon Software GmbH & Co. KG