CSS：tableがはみ出す原因を特定！たったこれだけのことで？？
管理しているホームページ社会福祉法人つくし園 の求人情報のページで、 tableを使って求人詳細を表示しているのだけど、 iPhone6・7・8で確認した時に、なぜか一部のページだけtableがはみ出ていた。 同じ、テンプレート、CSS（スタイルシート）を使っている別のページは問題ないので chromeのデベロッパーツールを使って確認しても原因がかわからず、2時間ほど悩んだ。 はみ出している状態 ↑が右側にはみ出していて、全部表示できていない状態。 table.recruit { width: 100%; margin: 0 auto; border-collapse: separate; border-spacing: 0px 15px; } width:100%;も設定しているのに大幅にはみ出している。 ↓は、同じテンプレート、CSSを使っている別の求人詳細のページ。 はみ出していない
Firefoxでテーブルのthとかtdにはposition:relativeが効かない件 - 主に技術的なことを書くブログ
Firefoxでは、テーブルのthとかtdにはposition:relativeが効かないというか。 borderとかが消えたりとかします。 しかし、真実は、ChromeやIEが独自の実装をしているだけで、本当の正義はFirefoxにあると。 どういうシーンで起こるか th内の右上とかに小さいボタンを置くときにわざわざthの中で、ブロックを2つに分けてフロートとかさせるのはちょっとしんどい。なので、positionでやろうとすると、thにposition: relative;をかけることになるので、起こる。という具合です。 解決方法 単純にdivをかまして、そっちにposition: relative;をかける。 th.inBtn { padding: 0 !important; /* table全体でかけてる内側パディングとる */ } th.inBtn > div { position
Androidのブラウザでテキスト文字が折り返しされる：帳：So-netブログ
先日、シャープのAndroidスマートフォン SH-06Dを購入して、いろいろなPC向けサイトを見ていたところ、テキストの文字が中央付近で、折り返され、改行されるような現象に出くわしました。 再現機種は、Sh-06D、Androidバージョン4.0.4です。 シャープサイトより http://www.sharp.co.jp/bd/product/bd-w1200_520/features.html 赤丸で囲ったスペースが改行されている部分です。文章が中央で折り返しになり、左に寄ってしまっています。 本来のレイアウトは、このようになっていて、折り返しはありません。 このように、テキストが改行される原因ですが、Androidのブラウザの「ページの自動調整」の機能がオンになっていることが原因です。この機能を切ることで、改行されなくなります。 ブラウザ表示の時に、メニューボタン(スマホの下にある3
1
リリース、障害情報などのサービスのお知らせ
最新の人気エントリーの配信
処理を実行中です
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く
IE9用のCSSハック？Webページのフォントサイズ指定で今後注意する事
