...

View Full Version : css float vs display



chartwise
07-21-2011, 09:08 PM
Could someone please tell me what the difference is between float:left and display:inline-block

When should I use float:left and when should I use display:inline-block

I am trying to create an image gallery of thumbnail images to display the larger images in lightbox.

Help much appreciated

alykins
07-22-2011, 12:56 AM
these are not interchangeable... this is like comparing tacos to toiletries... you may use more toiletries because you ate tacos, but you cannot eat a toiletry nor can you clean yourself with a taco...

display is how it is displayed... float is how it moves on the page

display (http://www.w3schools.com/cssref/pr_class_display.asp)
float (http://www.w3schools.com/cssref/pr_class_float.asp)

Apostropartheid
07-22-2011, 02:12 AM
these are not interchangeable... this is like comparing tacos to toiletries... you may use more toiletries because you ate tacos, but you cannot eat a toiletry nor can you clean yourself with a taco...

We know what's on your mind today.

OT: Floats move elements out of the natural flow. Inline-blocks are within the normal flow. Both are adequate techniques for what you want to achieve, but remember: inline-block will respect whitespace between elements.

vikram1vicky
07-22-2011, 10:58 AM
Could someone please tell me what the difference is between float:left and display:inline-block

When should I use float:left and when should I use display:inline-block

I am trying to create an image gallery of thumbnail images to display the larger images in lightbox.

Help much appreciated


Float:left .... If total width of any element is less than 100% and we define float:left property to it. Then it will allow other elements to float after it in same line.

For more details see http://www.w3schools.com/css/css_float.asp link :)




Display:inline-block: .... for this see http://www.w3schools.com/cssref/pr_class_display.asp link :)



EZ Archive Ads Plugin for vBulletin Copyright 2006 Computer Help Forum