Front End, HTML/CSS, Uncategorized

Flexbox CSS Part (7) – Arabic || order

  • The css flexbox makes it easier to design flexible responsive layout structure without using float or positioning.
  • The order CSS property specifies the order used to layout the items in the container.
  • The default value is zero (0).

Continue reading “Flexbox CSS Part (7) – Arabic || order”

Front End, HTML/CSS, Uncategorized

Flexbox CSS Part (6) – Arabic || align-content

 

  • The css flexbox makes it easier to design flexible responsive layout structure without using float or positioning.
  • It is similar to align-items, but it aligns flex lines.
  • It should be used with wrapping.
  • align content values are: – stretch (default) – flex-start – flext-end – center – space-between – space around

Continue reading “Flexbox CSS Part (6) – Arabic || align-content”

Front End, HTML/CSS, Uncategorized

Flexbox CSS Part (5) || align-itmes: baseline

  • The css flexbox makes it easier to design flexible responsive layout structure without using float or positioning.
  • The align-items property specifies the default alignment for items inside the flexible container.
  • align items values are: – stretch (default) – flex-start – flex-end – center – baseline

Continue reading “Flexbox CSS Part (5) || align-itmes: baseline”

Front End, HTML/CSS, Uncategorized

Flexbox CSS – Part (4) || align-items

  • The css flexbox makes it easier to design flexible responsive layout structure without using float or positioning.
  • The align-items property specifies the default alignment for items inside the flexible container.
  • align items values are: – stretch (default) – flex-start – flex-end – center – baseline

Continue reading “Flexbox CSS – Part (4) || align-items”

Front End, HTML/CSS, Uncategorized

Flexbox CSS Part (1) – display, flex-direction, justify-content

  • The flexible box makes it easier to design flexible responsive layout structure without using float or positioning.
  • The parent container should take flex display property, display:flex.
  • flex-direction: to define the stack of the flex items.
  • flext direction could be: row, row-reverse, column, column-reverse.
    1. Row: the default (LTR).
    2. Row-reverse: (RTL).
    3. column: Top to bottom (TTB).
    4. column-reverse: (BTT).

Continue reading “Flexbox CSS Part (1) – display, flex-direction, justify-content”