ブロックの内側にボーダーを表示
大枠のブロックの内側にボーダーを表示する必要があったので備忘録。
そもそも大枠に擬似要素position: absoluteをかけてボーダーを表示させていたが、
ブロック内のaタグが押せなくなるため内側に表示させるようにしました。
オープンエア型イヤホンCreative Aurvana Air EP-AVNAIRを買ってみた
自分は特に外で音楽を聞くときはiphone純正のイヤホンで十分な人なんですが、
この間壊れてしまったので前々から気になっていたイヤホンを購入。
iphone6用 wrapsol全面保護シートを買ってみた
iphone6を購入してからTPUのケースは使用していたが特に画面は保護していませんでした。
理由は縁まで保護できるようなシートがないとこ。TPUケースに一緒についていたフィルムも嫌になって剥がしてしまってました。
いろいろ調べていたらwrapsolという商品が縁までカバーできるシートとの事だったので購入。
背面からサイドまでカバーできるタイプを購入してみました。
スマホサイトによくあるドロワーメニューをcss3のみで作成
フェイスブックアプリなどにある画面横からスライドして出てくるメニューをcss3のみで作成。
対象ブラウザは以下を想定。IE9はアニメーションはしませんが動作はします。
- ios 4以上
- android 2.3以上
- IE10以上
- モダンブラウザ
スマホサイト横並びナビ
スマホサイトで横並びのボタンの作成に毎回手間取るので備忘録的にメモ。
サポートブラウザは以下を想定。
- ios 4以上
- andoid 2.3以上
htmlは以下の様な感じ。class=”btnType”でデザインする。
spanにclass名はいらないが、運用などで別のspanが追加されることの想定してとりあえず的に付けている。
labelに関しては、次の配置の際複数行の高さに対応するため、table-cellで上下中央にしている。
ただしheigthの高さが1行時の高さになるため、3行4行になるとキツイ。その場合はjsなどで対応した方がよいと思われる。
矢印アイコンはafterで、詳しい解説は省きます。