I'm having trouble vertically centering both my text id="WhatIsMasterRow"
and image id="WhatIsMasterPhoto
. I've tried wrapping it in a .container
and using the bootstrap center-block
, as well as some other centering classes.
<!DOCTYPE html>
<html lang="en">
<body>
<!-- What is Master Page -->
<div class="row" id="WhatIsMasterRow">
<div class="col-md-6" id="WhatIsMasterText">
<div class="row-text", id="SubHeaderTextLeft"> What is a Master? </div>
<div class="row-text", id="RegularTextLeft"> Test Text </div>
</div>
<div class="col-md-2 col-md-offset-2 center-text">
<img id="WhatIsMasterPhoto" src="Resources/Images/Peter-Limmer-boots-2.jpg">
</div>
</div>
</body>
I've tried using margin: 0 auto;
as well, but it's not working.
.col-md-2 {
margin: 0 auto;
background-color: black;
}