CSS - position alignment

0 votes
298 views
added Jul 18, 2018 in CSS by LC Marshal Captain (25,790 points)
retagged Jun 13, 2019 by LC Marshal
<!--Vertical align 2 spans in one div-->
<div class="row">
  <span><img src="1.jpg"></span>
  <span>Company name</span>
</div>
 
<style>
span {
  display: inline-block;
  vertical-align: middle;
}    
</style>
/*centralize position"absolute element*/
margin-left: auto;
margin-right: auto;
left: 0;
right: 0;
 
/*justify cols without bootstrap*/
#header .desktop-header {
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: 0 20px;
    height: 60px;
}
 
/*Vertical align img*/
img {
  vertical-align: text-top;
}
 
 
/*To justify the text in sentences*/
text-align: justify;
 
/*Align item to be centralized*/
-webkit-box-align: center;
-webkit-align-items: center;
 
/*Centralized element vertically and horizontally*/
position: absolute;
left: 50%;
top: 50%;
transform: translate(-50%, -50%);

 

1 Response

0 votes
responded Jun 13, 2019 by LC Marshal Captain (25,790 points)
display: table;
margin: 0 auto;

 

lazacode.org - Malaysia's programming knowledge sharing platform, where everyone can share their finding as reference to others.
...