Home > Tags > CSS
CSS
SafariのCSS
<div id="menu">
<ul>
<li><a href="..."></a></li>
<li><a href="..."></a></li>
</ul>
</div>
こんなHTMLがあって、li要素をfloatで横並びにしてメニューを作る時
li要素の中のa要素はdisplay: blockするわけだけど
FirefoxやIE7なら
div#menu a {..}
これでもＯＫなのが、
Safari3.1(for Windows)だと
div#menu ul li a {…}
ときっちり書いてやらないとダメだった。あやうく、おおはまりするところだった。まあ、li要素かa要素に、idやclassを付ければいいんだけど。
- Comments: 0
- Trackbacks (Close): 0
The Ultimate CSS Reference
- 2008-03-03 (月)
- Web
The Ultimate CSS Reference、大人気CSSコピペサイト書籍登場 | エンタープライズ | マイコミジャーナル
なんか欲しい。
日本で買えるかどうかはわからないと書いてるけど、amazon.co.jpであっさり出てきた。4,562円だそうだ。
- Comments: 0
- Trackbacks (Close): 0
IEの動作をW3C標準仕様へ準拠させるためのライブラリIE7.js
- 2008-01-15 (火)
- Web
IE7.js登場 - IEのCSS/HTML非準拠はこれで対応 | エンタープライズ | マイコミジャーナル
使い方
<!--[if lt IE 7]> <script src="http://ie7-js.googlecode.com/svn/version/2.0(beta)/IE7.js" type="text/javascript"> <![endif]-->
- Comments: 0
- Trackbacks (Close): 0
CSSVista
- 2007-06-24 (日)
- Web
IEとFFで同時にCSSを確認しながら編集できるフリーソフト『CSSVista』,web2.0
CSSVista: Live CSS editing with Internet Explorer and Firefox simultaneously
WindowsXP only .Net Framework 2だそうな。.NetはPoderosaだけにしてくれとか思いつつ。ダウンロード。たった8.9MBに何分かかるんだろうか(TT)
12インチのノートのXGAじゃあまり便利じゃないか。でもよそのCSSファイルを見るにはいいかも。HTML内のCSSの記述も、外のファイルも全部ひろってタブ化してみせてくれるのはうれしい。
- Comments (Close): 0
- Trackbacks (Close): 0
floatとネガティブマージン
- 2007-05-21 (月)
- Web
フロートとネガティブマージンまとめ:CSS | Tech de Go
絵が美味い。floatはともかく、ネガティブマージンの挙動がすっきりした感じ。
- Comments (Close): 0
- Trackbacks (Close): 0
角丸画像
- 2007-05-11 (金)
- Web
角丸な画像って作るのが苦手だ。エッジの中間色を出すのが難しい。PhotoShopなら作り方が書いてあるページがいっぱいあるので、そのとおりにやればいいが、うちのCorel Paint Shop Pro Xでは、未だにレイヤーをうまく使えないのもあってしんどい（使いこなせてないだけの話だ）。ちょっと粘ってみたら画像のようなものができた。
まずは、画像の1/4のカーブの部分だけのサイズの画像を作り、「選択ツール」の選択（円形）で1/4の円を選択。それを塗りつぶす時に角丸の反対側の隅を中心に円形のゆるいグラデーション色で塗ってやる。そうするとかってにカーブ側にエッジの中間色が入る。
キャンパスのサイズを4倍にして、左と下の部分を1ピクセルづつ色がつながるように直線を引いてやると画像のように。まだ粗が見えるけど私にしちゃ上出来だ。
- Comments (Close): 0
- Trackbacks (Close): 0
Bamboo
- 2007-01-31 (水)
- Web
【レビュー】Webページレイアウトを「Bamboo」で記述する - クロスWebブラウザの対処法 (1) 複数のWebブラウザに対応したWebページを「Bamboo」で作る (MYCOMジャーナル)
Macもかい？、と思ったら違った。
- Comments (Close): 0
- Trackbacks (Close): 0
CSSを書き分けないで2段組をし、違う色をつける
- 2006-11-15 (水)
- Web
2段組でも、float: left 、rightを使うパターンをやったことがなかったのでやってみる。すると、float: left、leftの場合と同じように、青と赤の内容量に差があると、Firefoxだと、赤の下が何の支配下でもない空間ができてしまう。（CSSで装飾できない）。以前に困った時は段組の仕方を変えて、放置した（逃げたともいう）が、今回は試行錯誤してみる。
注）うすい緑のブロック（実際ははみ出ていない）をWrapperと呼ぶ
注）importantなどの技は使わず全く同じCSSファイルを使う
Wrapper に、 overflow: auto を指定。するとFirefox側で、図のIE6のようになって正常になるので、background-colorで指定すればよくなるが、今度はIE6がFirefoxのように空間ができてしまう。
Wrapperの背景に画像（青と赤を塗り分けたものを縦にリピートするイメージ）を指定する。するとそれぞれ補完され、どちらのブラウザでも図のIE6のようになる。
親ブロックにoverflow:autoを指定すると、IEとFirefoxで子のブロックのリサイズが逆転すると思っていいんでしょうか。（＾＾；；；
- Comments (Close): 0
- Trackbacks (Close): 0
IEで文字が消える件
- 2006-07-12 (水)
- Web
floatを使ってレイアウトをしてる場合に、親要素のwidthを指定していないと、文字が消えてしまう件を、某会のtDiaryで忘れていたのに今ごろ気が付く。(^^；；つまりこの日記もだった。(^^；；；；。
ごめんなさい、さっき直しました。
- Comments (Close): 0
- Trackbacks (Close): 0
CSSプロフェッショナル・スタイル―世界の「最先端」事例に学ぶ
- 2006-04-01 (土)
- Web
amazonのおすすめにあった。XHTML+CSSな本。大藤幹さんの本は読みやすいのがいい。CSS本で通しで全部読んだり、時々開くのはこの著者の本だけだったりする。これも買って損はないだろう。
- Comments (Close): 0
- Trackbacks (Close): 0
Home > Tags > CSS