Hello,
I'm trying to link a div in a guided landing page template but the text editor keeps throwing out the <a> tag when it's wrapped around a div. Is there a way around this? I'd rather not move the mktoText to the inner div and make the link a variable since I'd like the user to be able to make that dynamic.
<div class="tile mktoText" id="fourTileRow1Col1Title" mktoName="4 Tile Row 1 Col 1 Title">
<a class="text-link " href="#" target="_blank">
<div>
<h3>Title</h3>
<p>Text</p>
</div>
</a>
</div>
Solved! Go to Solution.
The way I've typically seen this done is to have them be separate elements inside a relatively positioned parent element. Here's a really loose example of something like that:
<div style="position:relative;">
<div>...some stuff in a div... </div>
<a href="#" style="position:absolute; top:0; left:0; height:100%; width:100%; z-index:1;"></a>
</div>
The idea is to use the inner div to create the height and width and "overlay" the link atop the inner div.
Hi,
You cannot use <div> or header tags (h1, h2) inside <a> tags. You can only use inline elements like span or something inside an anchor tag.
I'll suggest use a span tag and give styles according to header and paragraph.
You cannot use <div> or header tags (h1, h2) inside <a> tags.
You can in HTML5.
Right, and I already have the HTML5 doctype in the template. Guess it's just a limitation of the text editor.
The way I've typically seen this done is to have them be separate elements inside a relatively positioned parent element. Here's a really loose example of something like that:
<div style="position:relative;">
<div>...some stuff in a div... </div>
<a href="#" style="position:absolute; top:0; left:0; height:100%; width:100%; z-index:1;"></a>
</div>
The idea is to use the inner div to create the height and width and "overlay" the link atop the inner div.
Thank you! I had forgotten that's how it used to be done.