I’m trying to make the smiley face card here position to the right of the above content. I’m guessing it’s a layout issue or I’ve missed a closing tag or smoothing?
Hope you can help:
Are you aware that your page is totally blank with JavaScript disabled?
1 Like
No, I don’t understand please help further.
When visiting unknown web pages I initially have JavaScript disabled.
Your site had absolutely no visible content when I visited it.
Oh ok, interesting, thank you, would that be solved if I had a https?
If you mean that you want it to look like this screenshot:
Then you need to have both elements in the same bootstrap row and not start a new container and row. It should just be the column div. You have that element in a new container (which is not correct for the bootstrap syntax at that point anyway) and you also have it in a new row which means a new row and not next to anything 
You need to delete the 2nd container and its closing tag and the second row and its closing tag and the closing row tag above so that it all becomes the one row containing the columns.
The brief html would then roughly look like this:
<section class="mip-section pt-1 pb-5 bg-color gray-10">
<div class="container">
<div class="row g-4">
<div class="col-12 col-md-7 align-v-center">
<div class="holder">
<!-- Intro -->
</div>
</div>
<!-- Image -->
<!-- Card boxed -->
<div class="col-12 col-md-6 col-lg-4">
<div class="card boxed parent">
<!-- Image -->
</div>
</div>
</div>
<!-- Items -->
<div class="row g-3">
<div class="col-12 col-md-3"></div>
<div class="col-12 col-md-3"></div>
<div class="col-12 col-md-3"></div>
<div class="col-12 col-md-3"></div>
</div>
</div>
</section>
You will need to review those bootstrap classes though to get a better stacking on smaller screens. Please refer to the bootstrap documentation as it is explained in much more detail than I can take you through
1 Like