全エントリーの一覧

リスト表示に切替(タイトルのみ)

はじめに

このカテゴリではCSSビギナーの方向けに、ボクなりな説明でCSSで組むサイトを分かりやすいように書いていきたいと思ってます。 結構実践型でやろーと思ってますんで、ちゃんと覚えようって方のみお願いします。 対象者 htmlをある程度理解していて、チョットだけでもいいのでタグ打ちが出... 続きを読む

IEの様々なバグの真相らしきもの

IEには様々なバグが報告されていますよね。 もうコーダーからしたら勘弁して下さいって泣きが入りそうになるくらいに... 背景色が指定された要素内でfloatがある時、要素内の文字が消えるとか、floatに後続するmarginの値が無視されるとか、widthを指定しているとボックス... 続きを読む

DW8で生成するポップアップメニューがIE7で崩れる件を解消

DWで作成したポップアップメニューをIE7で見ると表示が崩れているという問題を簡単に解決する方法がネットのサラダボウルさんの下記エントリーで紹介されていました。 ネットのサラダボウル: DW8で生成するポップアップメニューがIE7で崩れる件を解消してみた 解決方法は簡単で、自動で... 続きを読む

文書型宣言についてのアレコレ

  • (X)HTML

CSSを覚えていく上でXML宣言と文書型宣言に関しての理解がないと、組んでいくうちにブラウザによって表示の違いが生じ、後から色々とスタイルを調整しても何が原因で表示が違うのか分からなくなってしまうといった事があると思います。 という事で、文書型宣言について自分なりのアレコレを書い... 続きを読む

XML宣言についてのアレコレ

  • (X)HTML

CSSを覚えていく上でXML宣言と文書型宣言に関しての理解がないと、組んでいくうちにブラウザによって表示の違いが生じ、後から色々とスタイルを調整しても何が原因で表示が違うのか分からなくなってしまうといった事があると思います。 という事で、XML宣言について自分なりのアレコレを書い... 続きを読む

ネタを募集しております

STOPN' LISTENさんの記事を読んでて思ったんですが、結構自分に取っては当たり前だと思ってた事や誰でも知っているだろうって事が多かったりします。 これ↓ こないだ知人に「ある部分にボタンを後からいれようと思ったけど方法が思いつかない」と相談され、 よしきた、下記のような方... 続きを読む

見出しの横などにボタンを配置

のイメージ" />結構見かける、見出しなどの横に配置されているボタン。 ウチのサイトでも、NEW ENTRYの横にRSSボタンをつけてます。 他に、続きを読むやMoreなんかが見出しの横にボタンやテキストとして配置されているケースが多いと思います。 このデザインを実現する際に、f... 続きを読む

mobileの文字コード検証

モバイルも検索エンジンの登場で一気に市場が拡大してるので、今後モバイルもCSSである程度見た目を制御する時代も近い内に来るのかなーと思う昨今。 現状で少なくともSoftBankのケータイ(911SH)はCSSをかなり読み込むようです。 全て検証していないので定かではありませんが、... 続きを読む

CSS Nite Vol.15+忘年会

  • 雑記

CSS Nite Vol.15+忘年会に参加してきました。 CSS Niteの参加は今回で3回目。 何気に3ヶ月連続でいってきました。 月に一度のチョットしたイベントって感じで中々毎回楽しみです。 そして今回は、毎回おこなっている打ち上げに初めて参加しました。 場所のプリントアウ... 続きを読む

HTML4.0/4.01の非推奨要素・属性

  • (X)HTML

CSSに移行したばかりだったり、先行して覚えちゃうとHTML4.0/4.01でdeprecated(推奨しない)とされた要素や属性に気付かずに使っているという最悪のケースに陥ってしまう事も無きにしも有らずです。 せっかくCSSにしたのに、font とか align なんかを使って... 続きを読む

ボクが良く使うMovableTypePlugin

コーディングをする上で、いまや必須なのがMT。 クライアントからの要望に答える為だったり、より便利にしてくれる為に、MTプラグインも必要とする時が多々あります。 ソレなのにいつも、「何処だっけ。。。あのプラグインは・・・」と無駄に探してしまうので、私的メモとして個人的によく使うプ... 続きを読む

秀丸エディタの強調表示定義ファイルを作ってみた

会社で秀丸Loveな人が居て、その影響かわからないけれどいつの間にかメインエディタが秀丸になっていたのですが、特に機能を使いこなすでもなく、ナニをする訳でもなく使っていたんですが、土日の暇な時間に何となく自分用の強調表示定義ファイルを作ってみました。... 続きを読む

再びリニューアル

年の最後って事で(?)、サイトリニューアルいたしましたっ! 前のサイトのデザインも自分の中では頑張ったなーと思ってたのですが、ココ最近いけてないと思うようになっており、リニューアルしたい衝動にかられて居たので、思い切って全面リニューアル決行しましたよっ。 絵とかコーディング、デザ... 続きを読む

clearfix

通常、floatさせている画像やボックスなどがある場合何らかの形でclearするか、その親要素にfloatを指定しないと、親要素からはみ出してしまいます。 コレはCSS2.0の仕様なんで正しい表示なんですが、どうしても親要素にfloatなどが使えず、やむなくclear:bothを... 続きを読む

画像の周りなどに1pxの破線を引く

画像の周りなどに1pxの破線を引く場合に、borderを使う事があると思います。 borderで破線を引くと、ブラウザにより表示が異なり何か気分が悪いですよね? その際、画像を使えばOKなんですが、サイズが固定なら画像でも簡単に枠が作れますが、画像サイズがバラバラで、かつ同じ枠線... 続きを読む

ランダムに数値を出すMTプラグイン

指定した数値内でランダムに数値を出すプラグインです。 ダウンロード ZIP テキスト 使い方 ランダムに数字を吐き出したいテンプレートに下記のように記述。 <$MTRandom from="0" to="10" digit="2"$> from ランダムで出力する数値... 続きを読む

target="_blank"を使わずに別ウィンドウで開く

通常外部リンクなどを別窓で開く際に、target="_blank"を使うと思うのですが、コレは非推奨となっているので、もうちょっと美しく別窓で開くにはどうしたらいいか? と何度か考えた事がありますが、適当にぐぐると、JavaScriptを使うものが何点かあるけど、ソレもイマイチス... 続きを読む

digiper

" src="http://css-happylife.com/img/website/digiper.jpg" />ふと、入社前の自分に振り返ったので、書かせていただきます。 結構思い出日記的内容になりそうなんですが…まぁ社員の本音(?)ってことで。 ... 続きを読む

InternetExploerer7 日本語正式版で早々に気になったバグ...

2006年11月2日に、IE7日本語版が正式にリリースされましたね。 そこで早速ボクも入れてみました。 Web好きっ子の一人として、ちょとワクワクしながらIE7のインストールを見守り、いざブラウジングスタート! ベータの頃にちょっとだけ使ったことがあるのでインターフェースやらタブ... 続きを読む

背景の真ん中にテキストを配置

↓こんな画像があったとして。 コノ中にテキストを入れる場合、真ん中に合わせるのがビミョーに面倒だったりします、、、よね? そんな時にチョットだけ便利なテクニック。 何かのタイトル こんな感じで真ん中に来ます。 上のサンプルで指定しているスタイルはこちら↓ margin:0; ... 続きを読む

PhotoBlogを作ってみた

  • 雑記

何を思ったか、写真なんて撮らないのにフォトブログっぽいモノが作りたくなり、作ってみました。 このフォトブログをテンプレートとして配布しようと思っているのですが、準備に想像以上に手間取り、中々公開出来ないので、こんなん作りましたよって事で雑記カテゴリでご紹介です。 写真やイラストな... 続きを読む

dlのdt dd を横並びに

何かと便利な定義リスト。 用語集や、Q&Aなど使いどころは沢山あるけれど、同じ行にしたいと思うことがしばしば有るかと思います。 しかし、中々思うように横並びが出来ないのが定義リスト。 今回はそんな厄介な定義リストのサンプルを作ってみました。... 続きを読む

IEバグ:img要素などの置換要素を含む行の前後では、line-heightが指定した値より小さくなる

行間を指定しているにも関わらず、imgなどの置換要素が含まれると、WinIEでline-heightで指定した値より小さくなるというバグ。 line-heightの値があまり大きくなければさして気にはならないのですが、line-height:200%など多少大きめに指定している場... 続きを読む

↑上に行くよ