Can't align a div in horizontal center

Shapely
1

Hi guys

I have been trying to align a div in the center so it matches with the image on top of it but have been unable to do that.

In the attached image, see the first image (YUG LUXE). The black strip below it needs to be aligned with the above image but it’s not happening for me. Can someone please help?

I’m using the following code:

<br /> <br />
<table>
<tr>
<td>
<div align="center"><img src="http://youngurbanguy.com/wp-content/uploads/2017/09/YUGluxe-2-274x300.png"></div>
</td>
</tr>

<tr>
<td>
<div align="center" style="padding: 5% 0; text-align:center; min-height:60px; background-color:black; width:274px; font-size: 105%; letter-spacing: 3px;">EXPLORE COLLECTION</div>

</td>
</tr>
</table>
<br /> <br />

Here is the link to the page I’m talking about: http://youngurbanguy.com/

P.S: the other two images next to it look aligned but when I open it on mobile screen, the entire image + the strip below it show left aligned whereas I want them in the horizontal center of the screen.

2

Any help on this? :slight_smile:

3

Okay, I tried and could figure it out. I am putting the code below. Maybe it could be of help for others:

<div style="text-align: center;">
	<div align="center" style="padding: 5% 0;text-align:center;min-height:60px;background-color:black;width:274px;font-size: 105%;letter-spacing: 3px;display: block;margin: 0 auto;">EXPLORE COLLECTION</div>
</div>
4

Hi,

Glad it works. :slight_smile:

Let us know If you have any other questions.

Thanks,
laranz.