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

XF 1.5 Grid View?

Hecter

Active member
#1
I'm trying to add grid view into pages that I have created, I did this before so I'm effectively copying and pasting the code across from an old site to my new site but on the new site the code does not display properly.

<ul class="indexgrid">
<li class="textbox"><h2>Header Text</h2><p>Some information pertaining to header text.</p></li>
<li><a href="{xen:link /link to content/}"><img src="link to image" /><h3>Blah</h3></a></li>
<li><a href="{xen:link /link to content/}"><img src="link to image" /><h3>Blah</h3></a></li>
<li><a href="{xen:link /link to content/}"><img src="link to image" /><h3>Blah</h3></a></li>
<li><a href="{xen:link /link to contents/}"><img src="link to image" /><h3>Blah</h3></a></li>
<li class="textbox warning"><h2>Header Text 2</h2><p>Text pertaining to header text 2</p></li>
</ul>

This should in theory put the images next to each other in a grid view until the space runs out then it drops the image down a level and again the images go next to each other. Before I had this 2 images side by side then it should jump down and another 2 side by side.

Am I missing something?
 

Brogan

XenForo moderator
Staff member
#3
Which template is it?

Have you included the necessary css template which contains the indexgrid class?
 

Hecter

Active member
#4
Which template is it?

Have you included the necessary css template which contains the indexgrid class?
No, damn I knew I shouldn't post with a hangover, and now I can't find the bloody css.

The template is custom made happy to PM it to you but would prefer to keep some of this stuff away from the public eye at the moment.

Apologies for putting this in the wrong area as well.
 

Brogan

XenForo moderator
Staff member
#5
You just need to add the css directly to the template using style tags, or create a new css template and include that in your template.
 

Hecter

Active member
#7
You just need to add the css directly to the template using style tags, or create a new css template and include that in your template.
I found the css file for the grids, how do I call it into the pages? I tried
<xen:require css="link to css/style.css" />

But its not affecting it.

I notice there is this: css_main_template_top but I cannot find where this is on my old site.
 

Hecter

Active member
#8
I added it to the extra.css for now and its working but there is a lot of stuff in that extra.css now not sure if that would affect the speed of the site?
 

Hecter

Active member
#11
http://www.clubsgaming.com/forum/home/

Got it the way I want it, but I'll be damned if I can center that top image, plus I cannot get the top image to rotate the way it should either.

Code on the template:
Code:
<ul class="rslides">
    <li><img src="styles/default/seasons/general/join.png" alt=""></li>
    <li><img src="styles/default/seasons/general/slider1.png" alt=""></li>
    <li><img src="styles/default/seasons/general/slider2.png" alt=""></li>
</ul>
css
Code:
.rslides {
    position: center;
    list-style: none;
    overflow: hidden;
    width: 75%;
    padding: 0;
    margin: 0;
}

.rslides li {
    -webkit-backface-visibility: hidden;
    position: center;
    display: none;
    width: 100%;
    left: 0;
    top: 0;
}

.rslides li:first-child {
    position: center;
    display: block;
    float: center;
}

.rslides img {
    display: block;
    height: auto;
    float: center;
    width: 100%;
    border: 0;
}