Skip to content
View in the app

A better way to browse. Learn more.
OKCCN - XenForo & IPS Plugin Marketplace

A full-screen app on your home screen with push notifications, badges and more.

To install this app on iOS and iPadOS
  1. Tap the Share icon in Safari
  2. Scroll the menu and tap Add to Home Screen.
  3. Tap Add in the top-right corner.
To install this app on Android
  1. Tap the 3-dot menu (⋮) in the top-right corner of the browser.
  2. Tap Add to Home screen or Install app.
  3. Confirm by tapping Install.
  • Language

Responsive Web Design

Cavalry
in Tutorial

Featured Replies

  • Administrators

Responsive Web Design

Introduction to Responsive Web Design

Responsive web design is about creating web pages that look good on all devices!

A responsive web design will automatically adjust for different screen sizes and viewports.

Best Experience For All Users

Web pages can be viewed with many different devices: desktops, tablets, and mobile phones.

Your web page should look good, and be easy to use, regardless of the device.

Responsive web design is about using HTML and CSS to automatically resize, hide, shrink, or enlarge a website, to make it look good on all devices.

Key components in responsive web design are:

  • Viewport <meta> tag
  • Flexible layout (grid and flex)
  • Mediaqueries


Desktop

Tablet

Phone

Try it Yourself »


  • Quote

    • Join the conversation

    You can post now and register later. If you have an account, sign in now to post with your account.

    Guest
    Reply to this topic...
    Go to topic listing

    Account

    Navigation

    Search

    Search

    Configure browser push notifications
    Chrome (Android)
    1. Tap the lock icon next to the address bar.
    2. Tap Permissions → Notifications.
    3. Adjust your preference.
    Chrome (Desktop)
    1. Click the padlock icon in the address bar.
    2. Select Site settings.
    3. Find Notifications and adjust your preference.