University
Home
Search
⌘E
Dashboard
Try Webflow — it's free
Learn
Courses
Docs
Videos
Interactive Learning
Glossary
Certifications
Engage
Support
Community
Events
Forum
Accessibility
Switch to Light mode
Switch to Dark mode
High contrast
Glossary
Display property

Display property

Display properties operate like instructions that tell a browser how to display the different parts of a webpage. You can customize an element’s appearance and layout by changing its display property.

Here are some of the most common values for display properties in CSS:

  • Block — The element starts on a new line and takes up the full width of its parent container unless you set a custom width
  • Inline — The element doesn’t start on a new line and takes up only as much width as its content requires
  • Inline block — The element generates a block-level box but allows inline elements to flow around it
  • Flex — The element generates a flexbox (ideal for responsive layouts)
  • Grid — The element generates a grid container (ideal for layouts with rows or columns)
  • None — The element isn’t visible

If you’re used to working with drag-and-drop design tools, manually adjusting display settings may require a bit of trial and error. Visit our Webflow University course on CSS layout and positioning to learn more.

Relevant courses

Web elements

A comprehensive look at the building blocks and elements Webflow puts at your fingertips — start designing websites visually, with confidence.

Getting started with Webflow

Get familiar with Webflow’s website experience platform.

CSS grid in Webflow

An overview of CSS grid. Use the grid layout in Webflow to get more control over your designs and create powerful, responsive layouts — faster.

Figma to Webflow

Learn the entire design process from idea to final output as we take you through Figma, Cinema 4D and Octane, and Webflow.

Webflow 101

Introducing Webflow 101, the ultimate course to learn the fundamentals of web design and development.

Client's guide to the Editor

This is the Client's guide to the Webflow Editor. Share these lessons to get your clients up and running.

Other glossary terms

Thank you! Your submission has been received!
Oops! Something went wrong while submitting the form.

Container

→
An element that contains content.

Style panel

→
The first tab in the right-side panel that allows you to assign classes to elements and style them.

Registrar

→
A registrar, or domain name server (DNS) registrar, manages the sale of domain names and the assignment of IP addresses, ensuring each domain’s uniqueness.

Application context

→
An application context is a set of data that identifies an application’s tasks, where those tasks originate, and how those tasks are configured.

Interpolation

→
Interpolation is a mathematical process that estimates and creates new values based on known values and their relationship.

Rich text element

→
Allows you to create and format headings, paragraphs, blockquotes, images, and video all in one place instead of having to add and format them individually.

Map

→
A Webflow element that embeds an interactive Google Map in your site.

Cascading rules

→
The order in which a Webflow site's CSS styles flow from desktop to mobile breakpoints.

Designer

→
The main interface where you can build sites.

Traffic

→
Traffic, or web traffic, refers to the number of users who visit a website over a period of time.

Style Manager

→
The third tab in the right-side panel where you can rename element classes, preview your class and tag styles, search for classes and tags, and delete any classes that aren’t in use.

List item

→
A list is a Webflow element that displays multiple pieces of content in a structured, visually appealing way. The individual elements that make up the list are called list items.

A/B testing

→
A/B testing compares two different versions of something — like a web page or campaign — to determine which performs better.

Localization

→
Localization (l10n) involves adapting digital content and applications to meet a specific region or culture’s language and conventions.

Element edges

→
The color-coded borders of elements you'll see in the Webflow Designer.

Google site verification meta tag

→
Adding a Google site verification meta tag to your website's HTML code allows Google to verify that you own the site.

Domain

→
A domain, or domain name, is the unique address that directs to a website on the internet.

Hyperlink

→
Hyperlinks are clickable elements that allow users to navigate between web pages, documents, or other types of digital content.

Site

→
What you create in Webflow! You can publish sites to a webflow.io staging subdomain for free, export the code on a paid plan, add hosting on any paid plan, or add a Site plan to any site to connect your custom domain and unlock hosting features.

CMS Collection page

→
A dynamic page that Webflow automatically creates for each Collection item. When you design a Collection page, all the pages that are created for each Collection item will have the same template but different content.

Site plan

→
A Webflow plan that you can add/apply to individual sites. You’ll receive access to different site and hosting features based on your Site plan.

File Transfer Protocol (FTP)

→
File Transfer Protocol (FTP) allows for the transfer of files between two parties over TCP/IP-based communication channels, such as the internet.

Callback function

→
A callback function is passed as an argument to another function and executed upon completing the latter’s task.

Automagically

→
Automagically describes complex content or functions that appear as if they were created using magic.

Folder settings

→
Allows you to manage your folders.

Delete element

→
To remove an element and its content from your website.

Save

→
The Designer automatically saves your progress every 10 seconds.

Rich text field

→
A rich text field is an input tool for formatting or applying text styles, such as bold, colors, font sizes, italics, underline, and other visual modifications.

Pages panel

→
A panel in the left toolbar where you can add static pages and folders to your Webflow site. You can also manage and access Utility pages and Collection pages.

Left toolbar

→
The vertical bar of tools on the left side of the Webflow Designer. It holds the Add panel, Symbols panel, Navigator panel, Pages panel, CMS panel, Ecommerce panel, Assets panel, Settings panel, Site Activity log, Audits, Search, Video tutorials, and Help.

Subdomain indexing

→
When a search engine crawls your site's Webflow subdomain (e.g., your-site.webflow.io).

Link block

→
A link block operates much like a div block, an HTML element for grouping and organizing other HTML elements (like text, images, and forms) into block-level containers. But in the case of a link block, what’s inside the block becomes a link.

Last updated

→
The last time someone made a change to your site.

Select field

→
A form element that allows you to make a selection in a dropdown list.

Radio button

→
A radio button is a form element for selecting one option from a predefined set of mutually exclusive choices.

Multi-reference field

→
A CMS field used in Collections. Just like a reference field, the multi-reference field lets you reference other Collections in your site. But it’s even more powerful, as it lets you reference multiple items within a Collection instead of just 1 item.

Node title

→
The type of element you're working with, i.e., H1, link, button, etc.

Sitemap URL

→
The location your sitemap is stored in relation to your site, and what’s used when submitting your sitemap to search engines.

Date/Time field

→
A field available in CMS Collections. This field lets you display a date and time in a Collection and/or Collection item.

Section

→
A section is an element of design layout that divides a web page into visually distinct segments.

Cipher

→
In cryptography, a cipher is a digital security algorithm that encrypts and decrypts data.

Mobile (portrait) breakpoint

→
A Webflow canvas setting that lets you create styles for viewports with a minimum width of 240px and a maximum width of 479px. Also known as the mobile portrait media query.

Height: auto

→
The "height: auto" CSS property automatically adjusts an element’s height based on its content.

Wrapper

→
A wrapper is a programming language function for encapsulating and organizing elements within a well-defined interface.

Left padding

→
Left padding is a CSS property that defines the space between an element's left border and its content.

Optimization

→
Optimization is a systematic approach to improve a website's appearance, functionality, and visual appeal to enhance the user experience, improve search engine rankings, and achieve business objectives.

Serialization

→
Serialization is the process of converting data into an optimized format for storage, transmission, and sharing.

Percent

→
A measurement unit relative to an element's parent.

Keyboard shortcuts

→
Keyboard shortcuts are combinations of keys on a computer keyboard that perform a specific action or command within an application or operating system.

Content-first design

→
A design approach that prioritizes content planning and production in the design process.

Breadcrumb

→
A breadcrumb, or breadcrumb trail, is a navigational element representing a user’s current location within a website's hierarchical structure.

Background

→
A website background is a visual element behind webpage content, enhancing aesthetic appeal and user engagement.

Tag

→
A Hypertext Markup Language (HTML) tag is a code snippet that defines and describes the structure and content of web pages.

Subdomain

→
The part of a domain that comes before the root domain (e.g., blog.yourwebsite.com is a subdomain whereas yourwebsite.com is the root domain).

Username

→
The ID used to log into your Webflow account.

Plugin

→
A plugin, also called an add-on or extension, is a software component that enhances the host or browser or application by adding new features or capabilities to it.

Mutable

→
In JavaScript, mutable objects are dynamic elements that allow post-creation changes and modifications.

Adobe Fonts API token

→
An Adobe Fonts API token protects and supports your data from Adobe Fonts with other programs you may be using to personalize your website’s fonts.

Real-Time Streaming Protocol (RTSP)

→
Real-Time Streaming Protocol (RTSP) is a standardized network protocol for transmitting real-time multimedia data like audio and video.

Contextual advertising

→
Contextual advertising is a form of paid advertising that matches web content with ad intent.

BiDi

→
BiDi stands for bidirectional. When a document is BiDi, it supports text that reads from right to left and left to right.

Redo

→
To move forward one step while making changes to a Webflow site.

Behavioral targeting

→
Behavioral targeting is a marketing technique that leverages user data to deliver personalized ads to drive conversions.

Flex-shrink

→
The flex-shrink CSS property defines how much an element shrinks relative to other flexible items inside the same parent element.

Public site

→
A Webflow site that is publicly visible in your public profile and in Made in Webflow search results.

Alt text

→
Alt text, short for alternative text, refers to text that describes online images.

Zapier

→
A web app that helps you connect multiple third-party services together based on triggers and actions.

Item state

→
The default UI state for Collection lists, which displays the items in the Collection. It is the opposite of the empty state.

Attribute

→
An attribute in HTML is a term inside an opening tag of an element, such as a font or color, that provides additional information about the element.

Lightbox

→
A lightbox displays content in a popup or modal window on top of a web page’s main content.

ATAG

→
Authoring Tool Accessibility Guidelines (ATAG) are a layered rule-set that influence how designers and developers create a more accessible internet.

Flex-direction

→
Flex-direction is a CSS property that defines the main axis and direction of flex items, dictating the arrangement of the items within a flex container.

Dynamic element

→
Dynamic elements are web page components that can change based on user interaction or external factors, like a live news feed, without requiring a page refresh or reload.

Flex-align

→
A flexbox property that lets you customize the alignment behavior of flex children, based on the cross-axis of the flex container. The cross axis is the opposite of the flex-direction property, so if you set the direction to vertical, the cross axis is horizontal. Options include start, center, end, baseline, and stretch.

Empty elements

→
Empty or void elements are HTML elements that don’t require a closing tag because they contain no content.

Navigator

→
A navigator, or a navigator window or panel, is a graphical user interface (GUI) that provides an overview of a website's structure and layout.

Field label

→
A field label is descriptive text that helps users understand what information to enter in an input field on a web form.

Folder

→
A folder is a subdirectory of your site's root folder for organizing web pages.

Middleware

→
Middleware is software that links different programs and applications, allowing them to interact and communicate effectively.

Gamut

→
Color gamut describes the full range of colors a device can reproduce on its display.

Structured Query Language (SQL)

→
Structured Query Language (SQL) is a programming language that enables storing, retrieving, and manipulating information in a relational database.

Webclip

→
A 256 x 256 px image associated with your website that shows up when your website link is saved to an iPhone home screen.

Bottom padding

→
Bottom padding is the space between the bottom of an element and its border.

Webflow Editor

→
Webflow's visual content editor. You can access it through the Webflow Dashboard by clicking the “3 disclosure dots” on a site thumbnail, then clicking “Editor.” Guest editors can access it anywhere on their live site by adding ?edit after the page URL (e.g., yoursite.com/page/?edit).

Flex-basis

→
Flex-basis is a CSS property used in flexboxes that sets the initial size of a flex item before it grows or shrinks.

CRUD

→
CRUD stands for Create, Read, Update, and Delete — the four basic operations all software applications should perform.

Ciphertext

→
Ciphertext is unreadable, encrypted data that ciphers use for security during data transit.

Closing tag

→
A closing tag is an instructional piece of code that ends a section of page content in HTML.

External link

→
External links direct users to different websites and impact a site's search engine visibility and rankings.

X-Ray mode

→
A grayscale view of your site’s canvas that visually displays each element’s border, margin, and padding when hovered over.

Google Universal Analytics Tracking ID

→
A unique ID you can use to link your Google Analytics account to your Webflow site.

Pixel

→
A pixel (px) is the smallest unit of measure in a digital image or display, representing a single point of color or light.

Certificate authority

→
A certificate authority (CA), also known as a certification authority, issues digital certificates that verify a website’s owner.

Smoke test

→
A smoke test, also called build verification testing or confidence testing, is a preliminary examination to determine the basic functionality of a software, website, or application.

Element

→
Elements are individual HTML components that constitute a webpage’s structure and contents.

Preview mode

→
A feature that allows you to see how your site would be displayed in a browser without needing to publish your site or leave the Designer.

URL redirect

→
URL redirect, or URL forwarding, is a web server function that automatically sends users from one web address to another.

Backlink

→
A backlink, also referred to as an inbound link, is a hyperlink from one website to another website.

Account notifications

→
Account notifications update you about activity in your account. New notifications appear on your Webflow Dashboard after you log in.

Padding

→
Padding is a CSS property defining the space between an element's borders and its content.
Hmm…we couldn’t find any results. Try a different search term or reset the filter.
Reset the filter
Load more