Simply add position absolute to your divs.
div{
position: absolute;
}
Solution 1 :
Solution 2 :
In the absence of other responses, I would suggest a table structure (since in emails you would already be using tables), and then a simple border-bottom or border-top, to achieve this.
If you want 15px of teal on the left, and the rest gray:
<table width="100%" cellpadding="0" cellspacing="0">
<tr>
<td width="15" style="border-bottom:1px solid teal">
</td>
<td style="border-bottom:1px solid grey">
<p>Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat non proident, sunt in culpa qui officia deserunt mollit anim id est laborum.</p>
</td>
</tr>
</table>
Problem :
I have 2 hr tags in an email body and I want to place them on top of each other.
This is what I have tried:
<div>
<div><hr color="gray" width="500" align="left"></div>
<div><hr color="teal" width="250" align="left" margin="-15px"> </div>
</div>
I have tried several different tags and until now I can see both hr tags one above/before the other.
Comments
Comment posted by Dan Raz
I try to add position=”absolute” and position: absolute; to each div but this did not heled
Comment posted by Dan Raz
This is email body so icannot use css
Comment posted by Nathan
There may not be a full cross-email-compatible answer. What’s your ultimate purpose here? There is probably a better/easier way forward