CakePHP Span Tag within Anchor Tag

cakephp, css, html

Solution

You need to use an empty string in stead of `null` as the text for the span, then your code will work as expected.

Looking at the source code of the HtmlHelper, `null` is treated as a 'special' value, causing only the opening tag of the span to be created. You can see this in this line:

https://github.com/cakephp/cakephp/blob/2.3.2/lib/Cake/View/Helper/HtmlHelper.php#L906

Change your code to this and it should work;

echo $this->Html->link(
    $this->Html->tag('span', '', array('class' => 'icon new')) . "FooBar",
    array('controller' => 'foo', 'action' => 'bar'),
    array('class' => 'some other  classes', 'escape' => false)
);

Additional explanation of the closing `</span>`

A bit of explanation, for those who wonder:

The closing `</span>` in your example is actually not present in the output generated by CakePHP, but automatically 'added' by your browser. If you view the source of the HTML in your browser, you'll see that this is what is actually in your HTML:

<a href="/foo/bar" class="some other classes">
 <span class="icon new">FooBar</a>

As you can see, no closing 'span'

Because the `<span>` is not closed, the browser will try to correct this error and automatically assumes that you 'forgot' to close it. Therefor it will add a closing `</span>` before the next tag it finds (in this case the closing `</a>`).

The 'inspector' in your browser will always show the HTML that the browser uses to render the output. This includes automatic corrections made by the browser and dynamically generated elements (e.g. Elements added via JavaScript).

To check the output of your PHP scripts, always view the source, not the inspector

Problem

Original source