主に技術的なことを書くブログ

浅めにマークアップ&フロントエンドの技術的なことをメモしていましたが、ざっくばらんに書いています。

CSS

忘れた頃にやってくる。

最近はコーディングなどをしていても、けっこうバグが起こらないように気をつけてシンプルにコーディングするので、起こっても、あぁ、たぶんあそこかなぁ、なんてわかることもあるんですが。今日、ちょっとした制約から、パディングとマージンをちょっと複…

フッターを下付きにするのはけっこうな手間。

CSS

コンテンツの内容が少ないときにフッターの下の余白が寂しい感じになるということがよくあるので、フッターを下付き(position:absoluteではなく)にしてウィンドウ縦幅に応じて上下に良い塩梅で可変するようにCSSでできないものかと、いろいろ調べてみたけ…

IE8で変わったこと。

web標準と、後方互換、二兎追うものは一兎も得ず。 altがポップアップしない。 bodyに対するテキストサイズ指定を「IEはハックで%指定、他のブラウザはpx指定」にしてると、文字サイズを変更できなくなってる。(メニューの互換ボタンを押せば、IE7のときみ…

position: relative;を使うと、もともとの画像の場所分の余白ができる。

CSS

縦に並んだ画像を、position: relative;で、上の方に移動させて配置すると、その画像がもともとあった場所の分、下に余白ができる。そういうときは、その移動させた要素に対して、margin-bottom: -○○px;など、ボトムにネガティブマージンをとってやると、余…

CSSでmin-heightをIEでも使えるようにする。

CSSでmin-heightをIEでも使えるようにする。■min-height div { min-height:100px; height: auto !important; height: 100px; } ■min-width div { min-width:100px; width: auto !important; width: 100px; } 参考: http://blog.creamu.com/mt/2008/03/cssmi…

IE6 でフロートさせるとマージンが2倍になるバグの対処。

IE7をメインで使うようになってついつい忘れがちやけど、IE6 でフロートさせるとマージンが2倍になるので、div { display: inline; float: left; width: 300px; } わざわざ*htmlハックをつかって指定を増やすよりも、「display:inline;」で対応。

IEだけでなんかわからんことが起こった場合には。

IE独自の拡張プロパティ、「hasLayout」が原因であることが多い。らしい。主な対処方は、その該当する要素、または、それを含む要素自体に、 widthをpx、または100%指定する。 height:1%を指定する。 zoom:1%を指定する。 と直るようです。 IEでのCSSのバグ…

チェックボックスを水平にする指定

フォームで、チェックボックスとラベルテキストを並べると、ブラウザによって、縦方向にちょっとだけズレます。そんなときはこういう風にCSSを指定すると、なんとか良い感じになるはず。input { margin-right: 2px; font-size: 93%; line-height: 1; vertica…