32 lines
		
	
	
		
			564 B
		
	
	
	
		
			Markdown
		
	
	
	
	
	
		
		
			
		
	
	
			32 lines
		
	
	
		
			564 B
		
	
	
	
		
			Markdown
		
	
	
	
	
	
| 
								 | 
							
								---
							 | 
						||
| 
								 | 
							
								title: Add Different Margins to Each Side of an Element
							 | 
						||
| 
								 | 
							
								---
							 | 
						||
| 
								 | 
							
								## Add Different Margins to Each Side of an Element
							 | 
						||
| 
								 | 
							
								
							 | 
						||
| 
								 | 
							
								To adjust the margins of an element use:
							 | 
						||
| 
								 | 
							
								
							 | 
						||
| 
								 | 
							
								```css
							 | 
						||
| 
								 | 
							
								.example {
							 | 
						||
| 
								 | 
							
								  margin: 10px;
							 | 
						||
| 
								 | 
							
								}
							 | 
						||
| 
								 | 
							
								```
							 | 
						||
| 
								 | 
							
								
							 | 
						||
| 
								 | 
							
								To specify margins sizes on an element by individual sides we can use 'margin-top', 'margin-right', 'margin-bottom', and 'margin left'. We can use any of these in combination and in any order. For example:
							 | 
						||
| 
								 | 
							
								
							 | 
						||
| 
								 | 
							
								```css
							 | 
						||
| 
								 | 
							
								.example {
							 | 
						||
| 
								 | 
							
								  margin-top: 5px;
							 | 
						||
| 
								 | 
							
								  margin-bottom: 0px;
							 | 
						||
| 
								 | 
							
								}
							 | 
						||
| 
								 | 
							
								```
							 | 
						||
| 
								 | 
							
								
							 | 
						||
| 
								 | 
							
								Or:
							 | 
						||
| 
								 | 
							
								
							 | 
						||
| 
								 | 
							
								```css
							 | 
						||
| 
								 | 
							
								.example {
							 | 
						||
| 
								 | 
							
								  margin-top: 20px;
							 | 
						||
| 
								 | 
							
								  margin-left: 25px;
							 | 
						||
| 
								 | 
							
								  margin-right: 5px;
							 | 
						||
| 
								 | 
							
								}
							 | 
						||
| 
								 | 
							
								```
							 |