tag Layouts

標籤
貢獻26
34
11:50 AM · Nov 17 ,2025
vitaly-friedman 頭像 zoe-mickley-gillenwater 頭像 matt-cronin 頭像 newsletter-team 頭像 karenmenezes 頭像 sean-hodge 頭像 alma-hoffmann 頭像 ben-gremillion 頭像 zellliew 頭像 dirk-jesse 頭像 geir-wavik 頭像 obinwanne-hill 頭像

@Layouts / 博客 RSS 訂閱

divya-manian 頭像

Divya Manian - Six CSS Layout Features To Look Forward To

At W3Conf, I gave a talk on how the CSS Working Group is attempting to solve the concerns of Web developers with multiple proposals. There are six layout proposals that are relevant to us, all of wh

css3 , Layouts , coding , Css

收藏 評論

gabriel-shoyombo 頭像

Gabriel Shoyombo - Solving Media Object Float Issues With CSS Block Formatting Contexts

Let’s imagine we’re making a small component. It can be anything, really, but let’s use a media object as an example. Nicole Sullivan had a solid definition of media objects from way back in 2010, a

Tutorials , Layouts , coding , Css

收藏 評論

christopher-gammon 頭像

CJ Gammon - Killer Responsive Layouts With CSS Regions

As Web designers, we are largely constrained by the layout features available to us. Content placed inside a container will often naturally extend the container vertically, wrapping the content. If

Layouts , coding , Css , HTML

收藏 評論

john-imbong 頭像

John Imbong - The Definitive Guide to Using Negative Margins

Since the recommendation of CSS2 back in 1998, the use of tables has slowly faded into the background and into the history books. Because of this, CSS layouts have since then been synonymous with co

Layouts , coding , Css , Essentials

收藏 評論

newsletter-team 頭像

The Smashing Newsletter Team - Fixed vs. Fluid vs. Elastic Layout: What’s The Right One For You?

This article discusses the pros and cons of each type of layout. Either one can be used to make a successful website layout, as long as you keep usability in mind. Why all the debate? Web page desi

Layouts , coding , Css

收藏 評論

sven-lennartz 頭像

Sven Lennartz - 45 More Excellent Blog Designs

We, designers, are creative folks. And being creative, we permanently strive for inspiration — innovative approaches, crazy ideas, smashing concepts and, in general, unique designs which can help us

Showcases , Layouts , Inspiration , Blogging

收藏 評論

matt-cronin 頭像

Matt Cronin - 8 Layout Solutions To Improve Your Designs

In this article, we’ll discuss 8 useful layout solutions and techniques that will help you create a clean and organized content layout. The 8 techniques include sliders, tabs, progressive layouts, s

Techniques , Layouts , User Interaction , Design

收藏 評論

louis-lazaris 頭像

Louis Lazaris - The Z-Index CSS Property: A Comprehensive Look

Most CSS properties are quite simple to deal with. Often, applying a CSS property to an element in your markup will have instant results — as soon as you refresh the page, the value set for the prop

Layouts , coding , Css , Essentials

收藏 評論

michellebarker 頭像

michellebarker - Smarter Grids With Sass And Susy

If you’re a designer, you’ll know that grids are your friends. More often than not, they’re the vital architecture that holds a beautiful design together; they create rhythm, structure your page, le

sass , Grids , Layouts

收藏 評論

vitaly-friedman 頭像

Vitaly Friedman - 50 New Beautiful Blog Designs

There are things that can’t be showcased too often. For instance, beautiful blog designs. We have presented hundreds of beautiful blog designs in the past and now it’s time to provide our readers wi

Showcases , Layouts , Inspiration , Blogging

收藏 評論

enrique-ramirez 頭像

Enrique Ramirez - Coding An HTML 5 Layout From Scratch

HTML5 and CSS3 have just arrived (kinda), and with them a whole new battle for the ‘best markup’ trophy has begun. Truth to be told, all these technologies are mere tools waiting for a skilled devel

Layouts , coding , HTML , html5

收藏 評論

vitaly-friedman 頭像

Vitaly Friedman - 50 Useful Coding Techniques (CSS Layouts, Visual Effects and Forms)

This is where we come in. We are always looking to collect such articles for our posts so that we can deliver the most useful and relevant content to our readers. In this post, we present an overvie

Techniques , Layouts , coding , Css

收藏 評論

zoe-mickley-gillenwater 頭像

Zoe Mickley Gillenwater - Modern CSS Layouts: The Essential Characteristics

Now is an exciting time to be creating CSS layouts. After years of what felt like the same old techniques for the same old browsers, we’re finally seeing browsers implement CSS 3, HTML 5 and other t

Layouts , coding , Css , Essentials

收藏 評論

vitaly-friedman 頭像

Vitaly Friedman - CSS3 Design Ideas

This process has taken a lot of time as it wasn’t easy, because we received quite a few creative submissions: however, a decision had to be taken and so we thoroughly went from one competition entry

css3 , Layouts , coding

收藏 評論

cristian-diaz 頭像

Cristian Díaz - A Guide To Hover And Pointer Media Queries

The Internet is filled with a lot of interactivity, and more often than not the way we choose to show we can interact with an element is by using the hover pseudo-class. After all, changing an eleme

Techniques , Tools , Layouts , Css

收藏 評論

newsletter-team 頭像

The Smashing Newsletter Team - Adaptive CSS-Layouts: New Era In Fluid Layouts?

If you as a designer are going to go through all the extra work of creating a functional fluid layout, why not go a bit further and make it compatible with all resolutions, instead of just most? You

Layouts , coding , Css

收藏 評論

geir-wavik 頭像

Geir Wavik - Table Layouts vs. Div Layouts: From Hell to… Hell?

This article covers common problems with layout structure in web design. The first part goes through what table and div hells are, including lots of examples. The next section shows how to write cle

Tables , Layouts , coding

收藏 評論

obinwanne-hill 頭像

Obinwanne Hill - Breakpoints And The Future Of Websites

When the iPhone came out in 2007, the demonstration of its web browser by the late great Steve Jobs gave the not-so-subtle impression that Apple wasn’t too perturbed about its users pinching to zoom

Responsive Design , mobile , Media Queries , Layouts , Css , Javascript

收藏 評論

sean-hodge 頭像

Sean Hodge - Grid-Based Design: Six Creative Column Techniques

Grid systems bring visual structure and balance to site design. As a tool grids are useful for organizing and presenting information. Used properly, they can enhance the user experience by creating

Techniques , Grids , Layouts , Web Design , Design

收藏 評論

alma-hoffmann 頭像

Alma Hoffmann - Finding Alternative Sources Of Typographic Layout In Our Surroundings

The Framework Of Sources For Typographic Layout According to Wucius Wong in his book Principles of Form and Design (page 42), point, line and plane can be considered conceptual design elements beca

Typography , Layouts , Inspiration , Design

收藏 評論

ben-gremillion 頭像

Ben Gremillion - Laying Out A Flexible Future For Web Design With Flexbox Best Practices

CSS floats and clears define web layout today. Based on principles derived from centuries of print design, they’ve worked well enough — even if, strictly speaking, floats weren’t meant for that purp

flexbox , Layouts , Css , Design

收藏 評論

vitaly-friedman 頭像

Vitaly Friedman - Free Typographic XHTML/CSS-Layouts For Your Designs

The response was overwhelming and we really had a hard time going through the designs, analyzing them and deciding which templates deserve the awards. Unfortunately, many templates were just copies

Freebies , Layouts , coding , Css

收藏 評論

zellliew 頭像

Zell Liew - Website Layout Tools Compared: Flexbox Vs. Susy

Flexbox has become one of the most popular tools for creating website layouts. Susy is another layout tool that has gained popularity with the Sass community over the last few years. Many developer

sass , css3 , Tools , Layouts , coding

收藏 評論

dirk-jesse 頭像

Dirk Jesse - Flexible Layouts: Challenge For The Future

This article is a guest post written by Dirk Jesse, the developer of YAML (Yet Another Multicolumn Layout), an (X)HTMLCSS framework which explains his motivation for YAML in the last paragraph of th

Frameworks , Layouts , coding

收藏 評論