CSSで中央寄せの方法いろいろメモ - Qiita
ブロック要素は中央寄せにならないので、display: inline-block;でインラインにしてあげます。 margin: autoで中央寄せ margin: auto;を使って上下左右中央寄せにします。 ※中央寄せしたい要素の幅、高さを指定しないと親要素のサイズに合わせて伸びてしまうので注意。 .parent{ border: 1px solid #aaa; position: relative; height: 200px; width: 300px; } .inner{ border: 1px solid #aaa; width: 150px; height: 50px; top: 0; bottom: 0; left: 0; right: 0; position: absolute; margin: auto; }
Google HTML/CSS Style Guide
Background This document defines formatting and style rules for HTML and CSS. It aims at improving collaboration, code quality, and enabling supporting infrastructure. It applies to raw, working files that use HTML and CSS, including GSS files. Tools are free to obfuscate, minify, and compile as long as the general code quality is maintained. General General Style Rules Protocol Use HTTPS for embe
【CSSで3等分】要素をきっちり三分割するスタイルシートの書き方 - 自動化厨のプログラミングメモブログ │ CODE:LIFE
今日のお題は「きっちり」三等分できる書き方。 どんな書き方を想像しましたか？ この書き方を知るまで僕は .col3 li { width : 33.33333% ; } のような書き方をしていました。 実際にこの書き方をしているウェブサイトもよく見かけます。 が、性格の問題もあるかもしれませんが割り切れない 余り があるのがちょっと許せない。 width: 1/3; みたいな書き方ができたらいいのになー って思ってました。 で、探してみたところ発見！ 1/3サイズを指定する方法があったんです！ 感動(´ｪ`) CSSで計算式を可能にするcalc 対応ブラウザ：IE9以降、Safari6以降、Google Chrome19以降、Firefox4以降 使い方： .col3 li { width : calc(100% / 3) ; } これだけ！ 簡単ですね。全体の幅100%の3分の1サイズと
[CSS]スタイルシートを使用して現在位置のリンクを無効にする方法 | コリス
使用するのはCSS3の「pointer-events」で、対応ブラウザはFx3.6+, Safari3+, Chrome(5+?)となっており、IEでは未対応です。 HTML ナビゲーションはシンプルなHTMLです。 <textarea name="code" class="html" cols="60" rows="5"> <nav> <ul> <li class="home"><a href="#">Home</a></li> <li class="about"><a href="#">About</a></li> <li class="clients"><a href="#">Clients</a></li> <li class="contact"><a href="#">Contact Us</a></li> </ul> </nav> </textarea>
覚えて良かったCSSテクニック « zaru blog
ここ最近、覚えてよかったなーと思ったCSSテクニックをまとめてみる CSSテクニックは時代とともに変わっていくけれど、ここ1年ほどスタメンレベルで使うCSSテクニックが絞られてきたので、ここらでちょっと個人的にもまとめておこうかと。 liボックス 幅：190px マージン：15px liボックス ダミーテキスト。ダミーテキスト。ダミーテキスト。ダミーテキスト。ダミーテキスト。 liボックス ダミーテキスト。ダミーテキスト。ダミーテキスト。ダミーテキスト。ダミーテキスト。 <li>にはクラスを指定せずに、左右にぴったりくっ付くように配置が可能。 <style type="text/css"> #box1{ width: 600px; } ul{ width: 615px; margin: 0 -15px 0 0; overflow: hidden; _zoom: 1; font-size:7
1
リリース、障害情報などのサービスのお知らせ
最新の人気エントリーの配信
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く
