[CSS]マージンとパディングの使い分け方 -コンテナとコンテンツ間、コンテンツ内の要素間 | コリス

2017/03/09 140 users パディング padding margin コリス マージン

CSSでスペースを与える時、マージン(margin)とパディング(padding)はどのように使い分けをしていますか？ Webサイトやスマホアプリで実際に使用されるUIコンポーネントを例に、マージンとパディングの使い分け方を紹介します。 下記のように3つの要素間にある2つのマージン指定も、first-childやlast-childでネガティブマージンを使わずに指定する巧い方法に、目からウロコです... 続きを読む

これは簡単でいいね！コンテンツの区切りを斜め線にするテクニック（レスポンシブ対応） -Angled Edges | コリス

2016/12/12 125 users コリス Mixin レスポンシブ対応 テクニック Sass

縦長ページなど、コンテンツを積み重ねてレイアウトする際に、コンテンツ間の区切りを斜めにするSassのMixinを紹介します。 斜め線はSVGなので、デスクトップでもスマホでも美しく斜めに表示されます。 Angled Ed ...記事の続きを読む 続きを読む

HTML5で誤用されがちな各要素の正しい使い方 | コリス

2011/09/27 290 users WYSIWYGエディタ コリス 誤用 スペース 各要素

HTML5はXHTML1.0やHTML4を継承しつつ、使い方が大きく変わった点もあります。 よく利用されるHTML5の各要素の誤用されがちな例とそれを正しく適切に使う方法を紹介します。 下記は各ポイントを意訳したものです。 <br>の誤用 <br>の間違った使い方 <br>のよくある誤用は、コンテンツ間にスペースをつくるために使用することです。 これはWYSIWYGエディタで作成するとよく起きる現... 続きを読む