Floating an image with the xen:h1 and xen:description tags?


Active member
How would one go about floating an image left of the <xen:h1> and <xen:description> tag?

I'm trying to achieve a similar effect seen in the Resource Manager, such as:



Active member
I don't have the resource manager installed, so I don't have access to its templates.

Inspecting the source code (on here) only reveals the html structure and css used, which I already have a handle on.

Chris D

XenForo developer
Staff member
You can't actually do it with xen:h1 and xen:description. The HTML source and CSS is all you need to achieve it. That's how they do it in the RM.

The xen:h1 tag on that page is basically blank.


Active member

I was hoping(!) there was another tag, or an attribute to xen:h1, that I didn't know about but I guess not. I'll just construct it manually then. Cheers!


Well-known member

.resourceInfo h1:before {
    background: none repeat scroll 0 0 #000000;
    content: "";
    height: 16px;
    padding-left: 16px;
    width: 16px;


Active member
@Sheldon, I don't think that works because you're only affecting the h1 element. As you can see, the icon should be floating left of both the h1 and the description.

@Chris Deeming, using a <h1> tag instead of <xen:h1> doesn't work. If <xen:h1> isn't specified, then the view seems to default to using <xen:title> as a <h1> within the the titleBar div. And if you omit the <xen:title> it uses the site name as the heading.
Last edited:

Chris D

XenForo developer
Staff member
This is how the Resource Manager does it:


That has the effect whereby the <xen:h1> value is defined so the value doesn't come from <xen:title> but the value is empty so it doesn't render at all.