Skip to content

css positioning

July 5, 2008

In positioning:

All block elements come on top of each other. div, p

All inline elements come in flow. like span, input, image. (Gen dont take width height settings)

Float elements are block elements

Static is default position in IE – Offsetting  invalid.

Relative positioning : Offset exists

Fixed positioning : NOT Supported by IE. Offset from viewport.

Z-index,  stacking context – higher value infront and child takes parent’s stacking context.

Float to shift to extremes – needs width mandatory. IE fix:  display:inline; to remove margins. clear for entry boxes. Add  overflow:auto; to the parent element

inline-block: an inline that has offset allowed. works in few browser only. display:inline; and then display:inline-block in another selector makes it work in IE.

position:static and position:relative can be both display:block and display:inline
while position:absolute and position:fixed (and floats) will always be block elements.

if relative: sequenced element will come next as though the earlier element was positioned without css.
Z-index on any element without position:absolute, position:fixed or position:relative does nothing.

Internet Explorer 6 adds extra margin around floated  add display:inline

Firefox uses the property opacity:x for transparency, while IE uses filter:alpha(opacity=x).

An object is always represented in { param1:1, param2:2 }
An array is represented in [ val1, val2, {myObjectData }, values]

8 tricks to css

No comments yet

Leave a Reply

Fill in your details below or click an icon to log in: Logo

You are commenting using your account. Log Out /  Change )

Google+ photo

You are commenting using your Google+ account. Log Out /  Change )

Twitter picture

You are commenting using your Twitter account. Log Out /  Change )

Facebook photo

You are commenting using your Facebook account. Log Out /  Change )


Connecting to %s

%d bloggers like this: