CODEWITHSUNDEEP
css
user2945758
user2945758

Reputation:

CSS boxes going dont align on top

i'm having 3 containers with not the same height and i want to stack them horizontally howver the smaller boxes are at the bottom. How can i fix it? enter image description here

Here is the code i'm using for the boxes:

.brand{
border: 1px solid black;
border-radius: 6px;
-webkit-border-radius: 6px;
-moz-border-radius: 5px;
padding: 9px;
margin-top: 10px;
background-image: url('/pcbuilds/assets/images/squared_metal.png');
margin-left: auto;
margin-right: auto;
display: inline-block;
width: 200px;
}

Upvotes: 0

Views: 36

Answers (2)

user3387522
user3387522

Reputation: 127

Can you not just put 

position:relative;
top:0px;

Upvotes: 0

G-Cyrillus
G-Cyrillus

Reputation: 105923

vertical-align has to be used for inline and inline-boxe content, defaut vertical-align value is baseline.:

.brand{
border: 1px solid black;
border-radius: 6px;
-webkit-border-radius: 6px;
-moz-border-radius: 5px;
padding: 9px;
margin-top: 10px;
background-image: url('/pcbuilds/assets/images/squared_metal.png');
margin-left: auto;
margin-right: auto;
display: inline-block;
vertical-align:top;
width: 200px;
}

Upvotes: 2

Related Questions