CSS3 Table Layouts tutorial for Beginner

1
CATCH EXPERTS
https//www.catchexperts.com
http//www.courseing.com
2
CSS3 Table Layouts Tutorial Videos for
Beginners by
3
Highlights

• Table Layout
• Auto Table Layout
• Fixed Table Layout
• Border-spacing Property
• Border-collapse Property

4
Table Layout

•  Sets the table layout algorithm to be used for a
  table.
• Syntax table  table-layout Value . its
  default value is Initial, it uses inherit
  property to obtain parent properties
• Table layout value would be anyone of below
  properties.
•    

5
Auto Table Layout

• Auto layout value creates automatic table layout
  algorithm.
• Column width is set by the widest indestructible
  content in the cells.
• Commonly used by most browsers for table layout. 
• Width of the table and its cells depends on the
  content.
• Syntax table table-layout auto

6
Fixed Table Layout

• Fixed value describes fixed layout algorithm for
  the table.
• Fixed value Allows a browser to lay out the table
  faster than the automatic table layout.
•  Browsers starts displaying the table whenever
  the first row has been created.
• Rendering speed is greater than auto table
  layout.
• Syntax table table-layout fixed

7
Border-spacing Property

• Specifies the distance between the borders of
  adjacent table cells.
• Similar as cell spacing attribute of HTML.
  Syntax border-spacing value
• Border spacing values three types. They are
  length, horizontal, vertical.
• Length describes both the horizontal and vertical
  spacing between cells.
• Horizontal value describes the horizontal spacing
  between cells.
• Vertical value describes the vertical spacing
  between cells.

8
Border-collapse Property

• Determines whether a table's borders are
  separated or collapsed.
• In collapsed model one table cell share borders
  with adjacent cells.
• Syntax border-collapse value collapse and
  separate are the two values of collapse property.
• Separate keyword request the use of the separated
  border table rendering model.
• Collapse keyword request the use of the collapsed
  border table rendering model.
• Separate is the initial or default value.

9
Feedback
Like It ? Hate It?
We would love to hear from you whatever you think
about the course.
Click HERE to share what you think!
10
Thank you
Thank You for Watching CSS3 Table Layouts
Tutorial Videos for Beginner by
http//www.courseing.com