Jump to content

Center Latest Items list on home page


Recommended Posts

Maybe this has been covered before but I am unable to locate it in the forum.

Is there a way to center the list of the latest items on the home page?   

 

Also was wondering if that outer box grey line can be  made smaller and not visible without affecting the size of the picture?

 

I am using the Foundation skin with the latest version of CC 

thank you very much for this help

center.jpg

Link to post
Share on other sites

This will involve adding some new CSS and making a small, but important change to a template.

In content.homepage.php, find:

<ul class="small-block-grid-1 medium-block-grid-3 large-block-grid-3" data-equalizer>

Change to:

<ul class="small-block-grid-1 medium-block-grid-3 large-block-grid-3 panelslist" data-equalizer>

Then find:

      {foreach from=$LATEST_PRODUCTS item=product}
      <li>

Change to:

      {foreach from=$LATEST_PRODUCTS item=product}<li>

Then find:

      </li>
      {/foreach}

Change to:

      </li>{/foreach}

This adds a class we will use to override comparable settings found earlier, and removes whitespace between the panels that would otherwise cause the total width of the panels in a row to exceed the available width of that row, thus causing the last panel of a full row to move down to the next.

In /css/cubecart.default.css, add the following:

.panelslist {
  margin: auto;
  text-align: center;
}

.panelslist li {
    position: relative;
    display: inline-block;
    overflow: hidden;
    float: none;
}
.panel {
    padding: 0.50rem;
    border: none;
}

This does have the unfortunate side effect of centering the text within the panel. Maybe you can work on figuring out how to override that.

I found this answer here:

https://stackoverflow.com/questions/30698432/how-to-center-align-zurb-foundation-block-grid-elements-that-are-being-pushed-to?rq=1

The adjustment to the panel class affects all panels, everywhere.

 

  • Thanks 1
Link to post
Share on other sites

Thank you again for your expertise B I appreciate it.  I am not even close to being a novice when it comes to css and when I search the net I always get confusing results when I type what I am looking for. But that's ok I am learning.

 I get frustrated with this build a few times a day but I won't give up t'ill it's done, this platform is excellent.

AND when I do get annoyed cause I don't understand, I just roll my chair to my sewing machine that's 2 feet away and go sew something...

then roll back to my 30 open windows and start again... lol

thank again 🙂

Link to post
Share on other sites

Join the conversation

You can post now and register later. If you have an account, sign in now to post with your account.

Guest
Reply to this topic...

×   Pasted as rich text.   Paste as plain text instead

  Only 75 emoji are allowed.

×   Your link has been automatically embedded.   Display as a link instead

×   Your previous content has been restored.   Clear editor

×   You cannot paste images directly. Upload or insert images from URL.

×
×
  • Create New...