03 « 3月 « 2009 « BPS株式会社開発ブログ Beyond Perspective Solutions LTD.

IE7でposition:relativeの要素が重なるバグ

2009.03.03 HTML, javascript, 馬場タグ: Ajax, CSS, HTML, IE, バグ — baba コメントは受け付けていません。

IE7で、JavaScriptを使って動的に要素を表示・非表示した場合、要素が重なってしまうことがあります。

IE7だと問題が再現し、IE8やFirefoxは再現しません。また、冒頭のDOCTYPE宣言を外してQuarksモードにしても再現しません。
IE7でのみ、Showボタンを押すと、文字が重なってしまうはずです。

不思議なことに、21行目のbackground指定を外すと、再現しません。
また、21行目の<div>開きと22行目の<div>開きの間に「スペース・TAB・改行以外の何か(コメントでも可)」を入れると、再現しません。
22行目の[height:2em] は、hasLayoutがtrueになれば何でもOKです。

まとめると、
・ブロック要素Aがある。
・Aの最初の子要素はブロック要素Bである。
・AはCSSで背景がnone以外に指定されていて、[hasLayout=false]である。
・Bは[position:relative] であり、なおかつ[hasLayout=true]である。

これらの条件を満たす場合、「Aの前にある要素の高さが変わり、AのY座標が変更になっても、BのY座標は再計算されない」というIE7独自のバグと言えそうです。

DebugToolbar等で位置の再計算を行うと、正しい位置に移動します。

おそらく計算順序にバグがあるのだと思います。position:relativeを使うときは気をつけましょう。

Ruby on Railsでコントローラでヘルパーメソッドを呼ぶ

Ruby, Ruby on Rails, Web, フレームワーク, 伊藤タグ: rails, Ruby — tomotaka コメントは受け付けていません。

# app/controllers/application.rb
ApplicationController < ActionController::Base
  class HelperImpl
    include ::Singleton
    include ::ApplicationHelper
  end

  protected

  def helper
    return HelperImpl.instance
  end
end

これでコントローラからApplicationHelperに定義されてるメソッドをhelperメソッド経由で呼べる。