Articles tagged “Responsive Design” - Sort by article_views - Order by desc

design with flexbox

Design opportunities with Flexbox are AAAA mazing... You only need a bit of practice to master this skill. That’s why we created a comprehensive guide with syntax explanations and real...

Menu Builder Quick Start Guide

If you want to build good looking, well functioning navigation menus, you’ve come to the right app. CoffeeCup Menu Builder has been designed to help you build sophisticated, standards...

Responsive Layout Maker Quick Start Guide

Introduction Billions of people access the Internet from devices with all different screen sizes. To assure a good looking, usable website on every single device, it's gotta be responsive....

Adding a form to Responsive Site Designer

Web form Builder is an amazingly powerful, responsive form creator. Create forms for registrations, surveys, purchasing and more. Now that you have created a totally cool responsive...

Build your own layout in 9 simple steps

A solid, custom, responsive layout design in 9 simple steps This article will teach you how to create a structure of a responsive page design, focusing only on the placement of the content...

Responsive Site Designer Resource Overview

Your help guide for our #1 responsive apps Welcome to the resource headquarters for the most advanced responsive design apps on the web. This article offers a global overview of the...

How to make your Image Map Responsive

This article has been updated! Version 5.0 of CoffeeCup Image Mapper will create stunning responsive image maps which means no more having to “hack” the code to produce one! The Wizard will...

Adding Responsive Google Maps to Responsive Layout Maker

window.location.href = "http://www.coffeecup.com/help/articles/1432"

Responsive Google Maps

Google Maps™ can drive business right to your front door by providing your address, directions and landmarks for your customers to find you. In today's mobile-driven world, we need...

Responsive Web Design

About creating a web design, that fits all sizes Hold on now, if it fits unlimited device and screen sizes, the web site must be like...infinite? Without predefined size, impossible to...

Grids for bullet proof Responsive Design

Grids Create Order and Consistency. Consisting of a series of rows and columns, grid based layouts convey order and consistency. They provide an organizational framework that helps to create...

Chapter 1: Managing The Responsive Grid with Layout Maker

Row & Column Management in the Grid Keeping the content and page elements organized at every possible display width is virtually impossible without the use of a good grid system. Grid based...

Responsive Content Slider

Create Responsive Slideshows and Presentations Direct from the CoffeeCup labs is Responsive Content Slider. This app gives you the ability to combine pictures, text, buttons, icons and...

How to use CSS Display Properties in Responsive Layout Maker

Display Properties are used for controlling the way elements flow within your layout. All elements have a default display depending on what type element it is. Usually this is block or inline....

Practical responsive site design with RSD

Practical responsive site design Creating a static reference design There are many, many good existing fixed-width websites. Instead of redoing the entire design and approach, they can be...

Convert a static email to a responsive design

From an unreadable newsletter, to a responsive version in just a few hours I got this email from Zappos™ with the intriguing subject “Update regarding Zappos emails…”...

How to edit a website created with Responsive Layout Maker

We all know that designing a website can be time consuming and labor intensive and developing a responsive website can be even more challenging. There are so many different variables to a...

Chapter 2: Using Elements for Content-Driven Responsive Layouts

Populating the layout design with content elements This part of the application is so intuitive that it barely needs any explanation. Simply decide on your content needs, drag them on your...

Chapter 3: Prototyping and Layout Design

Customizing Content and Styles Each element, including the grid itself, the rows and columns, can be customized. These customization options are located on the...

Chapter 4: Refining Your Design

Responsifying the Design The preview (and editing) area in Responsive Layout Maker is an actual browser. This has the advantage that the design will look and behave exactly like it will when...

A Website Needs to Adapt... or Die

Preface: A Mobile Explosion It was the end of 2009, about 8 years after the dot-com bubble burst; the Internet counts close to 200 million domain names, and over 230 million websites (none of...

How to allow text to wrap around an image

The flowing of text around an image is a technique that is frequently part of a designer's arsenal. Although the process of wrapping text has changed over the years, this is easily accomplished...

Chapter 6: Editing Confirm and Notification Emails

With the ever changing world of web design and ever growing mobile market, your form notifications need to be crisp and responsive. By making this change, you are allowing customers to access the...

Chapter 7: How-to's and Resources

How-to's and Tutorials: With Responsive Layout Maker (RLM) not only can you create a wireframe/prototype, you can also export and create a responsive website from the generated files. Here...

Chapter 5: Explanation of Terms and Functions

To help you take advantage of the full potential of Layout Maker, we have put together a glossary of the most common terms we use through the software to help you become more familiar with the...

Centering your Buttons in a Menu

Here you will find the steps to center your buttons for a horizontal menu. If you need help with adding a background please see this article Extending Menu Background Across Entire Page ....

Creating Links with Responsive Site Designer

Create links to files, documents, external pages, anchors, email address and phone numbers. Responsive Site Designer makes it easy to link to other pages, files, and documents. You can...

How to add your own images to Responsive Layout Maker

One of the most common element everyone wants to add to their website are images. With Responsive Layout Maker, we offer you two options for adding them to your layout. The Export Path...

Responsive Actions - The Stack

The Stack This is one of the most frequently used responsive action. The reason for that is simple, at small screens there is little room for content to be displayed next to each other....

Chapter 8: Adding Your Menu To Your Website

Exporting your Menu Now that you have completed building your menu, it is time to get it into your website. When you select this option, you’ll be prompted to save your menu. Once this is...