CSSに関するネタを中心に色々書いてます。
下記のような指定でリストをinlineで並べ、li要素毎に改行すると、半角スペース分の余白ができてしまう。
ul {
text-align: center;
}
ul li {
display: inline;
}
<ul> <li><a href="/">トップページ</a></li> <li><a href="/service/">サービス案内</a></li> <li><a href="/company/">会社情報</a></li> <li><a href="/contact/">お問い合わせ</a></li> </ul>
んで、この余白を埋めるための方法をいくつか紹介しますだ。
完全な雑記。なんというか思い出話。
デジパでは恒例イベントとなりつつある、「三河湾チャリティー100km歩け歩け大会」が27日の朝7：30からスタートします。
今年、デジパからは7人が参加。
内、3人は2度目の参加っていう、ツワモノたちです。
本日の15：30頃に戦士たちは会社を後にし、戦場へと向かいました。
あ、ボクはこんな時間にブログエントリーしてるくらいなんで、参加しません。
ここ最近エントリーさぼり過ぎてたんで、ちょいネタでも上げていこうっていうスタンスで。
発生条件がイマイチわかってないんですけど、フラッシュを設置した際に、下にpaddingっぽい余白っていうか隙間っていうかが5px～10pxほど空くことがありませんか。IE以外のブラウザで。
こんな風に↓
図みたく、分かりやすい枠線が有ると露骨に気づくわけですが。
で、まぁコレは画像でも発生するベースラインのアレと同じなんで、解決方法は以下のように。
object,
embed {
vertical-align: top;
}
値は、bottomでもダイジョブです。
embed に指定が無いと、Firefoxで余白が発生して、object に指定が無いとSafariで発生するんで、どちらも指定すると良さげです。
MT4になって、引用ボタンが無くなったと思いこんでいたら、実はあったっていう事に今日気づきました。
でもこのアイコン、、、いかにもインデント用のアイコンっぽくて疑問が。
とまぁ、今回はSQLifeにてコンテンツ追加したので、お知らせっていうか宣伝です。
新規コンテンツ。
その名を「魔女っ子toniのままごとレシピ」。
普通のレシピとは違って、特定の感情を表現するようなレシピが揃ってます。
本日から開始したので、まだまだレシピの数は少ないですが、今後のレシピがとっても期待出来ます！
滅多に料理をしないボクだけど、ちょっと作ってみたくなってしまうような。
初回は、「失恋レシピ」！
作りたくなってしまうとはいえ、残念ながらここ最近失恋なんぞしてないから作れないっす。
そんな機会に巡り会ってしまったら作ってみようとは思いますが（苦笑
と、いうわけで、ここ最近失恋しちゃいました！って方、是非どーぞ。
JavaScriptいぢってるのは楽しいけど、書くことはまったく出来ないので、似たような機能を持つのが多い中でも選ぶ理由の一つが、class名が気に入るかとかhtmlがごちゃごちゃしないかとかそんな基準だったり。
んで、jQueryのプラグインの中でもjquery_autoさんがぼちぼち気に入ったけど、class名が！とか思ったので、いぢって自分用にしてみました。
そんな事してたら、他の便利なJavaScriptも足してみたくなったので、足したりしてたらこんなんなりましたっていうのを公開。
今回その実験に使わせていただいたJavaScriptたちは以下。
上記の色々なJSたちを自分用にしたサンプル？デモ？とダウンロードは以下。
見てお分かりのとおり、基本的には全部足しただけで別にどーこうってしてません。
主にclass名やらを自分の好みにして、重複しちゃってる機能を消したりという感じです。
こういうのはちょっとライセンス問題が気になるので、間違ってたらご指摘ください。
いちお、MIT LicenseとPublic Domainだったので、勘違いしてないか調べた限りでも、まぜまぜして公開するのはOKだったので公開してます。
どことなく良くありそうなリストのサンプルです。