• This site uses cookies. By continuing to use this site, you are agreeing to our use of cookies. Learn more.

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

Myke623

Active member
#1
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:

h1-img.PNG
 

Myke623

Active member
#3
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
#4
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.
 

Myke623

Active member
#5
Interesting!

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!
 

Sheldon

Well-known member
#6
Screenshot_4.png

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

Myke623

Active member
#7
@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
#8
This is how the Resource Manager does it:

<xen:h1><xen:comment>(empty)</xen:comment></xen:h1>

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.