Horje
flexbox Code Example
flexbox 
<div class="d-flex align-items-start">...</div>
<div class="d-flex align-items-end">...</div>
<div class="d-flex align-items-center">...</div>
<div class="d-flex align-items-baseline">...</div>
<div class="d-flex align-items-stretch">...</div>
Source: getbootstrap.com
flexbox 
Display: flex 
Flex-direction: row | row-reverse | column | column-reverse
align-self: flex-start | flex-end | center | baseline | stretch
justify-content: start |  center | space-between | space-around | space-evenly
Source: nethub.af
flex box in css 
<!--basic--flex--layout-->
<html>
	<head>
		<style>
			.parent{
              display:  flex or inline-flex;
              flex-direction: row  or column;
              flex-wrap: wrap or wrap-reverse;
 			}
		</style>
	</head>
	<body>
		<div class="parent">
			<div class="child-1"></div>
			.
			.
			.
		</div>
	</body>
</html>
css flexbox 
<div class="flex-container">
  <div>1</div>
  <div>2</div>
  <div>3</div>
</div>


Display: flex 
Flex-direction: row | row-reverse | column | column-reverse
align-self: flex-start | flex-end | center | baseline | stretch
justify-content: start |  center | space-between | space-around | space-evenly
display in flexbox 
/*This defines a flex container; inline or block depending on the 
given value. It enables a flex context for all its direct children.*/

.container {
  display: flex; /* or inline-flex */
}

/*Note that CSS columns have no effect on flex container*/
Source: css-tricks.com
flexbox 
<div class="my-container">  <img src="my-picture.jpg" alt="scenic view" />  <p>Lorem, ipsum dolor sit amet consectetur adipisicing elit. Esse facilis provident culpa eos sed sunt voluptates.</p></div>.my-container {  display: flex;  flex-direction: row;}
Source: medium.com



Css

Related
make element no styles Code Example make element no styles Code Example
zoom in to picture on html css Code Example zoom in to picture on html css Code Example
scale down image css Code Example scale down image css Code Example
css flexbox syntax Code Example css flexbox syntax Code Example
css stop text wrapping Code Example css stop text wrapping Code Example

Type:
 Code Example
Category:
 Coding
Sub Category:
 Code Example
Uploaded by:
 Admin
Views:
 8



 

Horje