Forum Support

Shape 5
March 28, 2024, 12:22:00 PM *
Welcome, Guest. Please login or register.

Login with username, password and session length
News: Shape 5 Forum
 
   Home   Help Search Login Register  
Pages: [1]
  Print  
Author Topic: Issues displaying masonry style when no image included - and no bullets  (Read 1053 times)
pjbg
Jr. Member
**
Offline Offline

Posts: 42



« on: December 08, 2016, 01:03:45 AM »

Thanks for a nice extension ... however I have the following problems.

Problem 1:

I have set up ALL, News Category 1 and News Category 2.

When I click a menu to go to the page where this module displays, ALL is the default and all articles display correctly in "masonry" format (just like the demo).

When I click News Category 1 and/or News Category 2 all articles still display correctly.

When I then click ALL again, all articles display, but not in masonry format. That is, each pair of articles (2 column format) top justifies leaving white space depending on how long the above articles are. See attached jpg.

If I hit browser refresh or menu heading again it refreshes to view correctly.

The only way for me to fix this issue (after a very long time problem-solving) is to add an image to one of the articles (it seems not all, just one). Fixed. But what if I don't want to include any images?

Even if I add an image to one of the articles and then, via the module, say NO to display images, the problem remains.

I have set the module to "no caching".


Problem 2:

Bullet points don't work in the articles when displayed via the Masonry module. The same article when viewed via a normal menu item they work as expected. Do I need to add new CSS code?

Thank you for your help.
Logged
jonahh
Administrator
*****
Offline Offline

Posts: 23789



WWW
« Reply #1 on: December 08, 2016, 12:54:46 PM »

Hello,
 
Thanks for the images but do you have a live URL I can view this at to help determine the issue? Also please let me know in which article you have bullet points that aren't showing up.

Thanks,
Logged

Jonah Hall
------------
Shape 5 Team

- Need a great host for your website? We highly recommend siteground.com!


- Put your trust in the hands of our extremely qualified staff to get your job done right!


- Firebug is the most powerful web development and debugging tool, and it will save you a lot of time, frustration and forum questions:
Install Firebug
pjbg
Jr. Member
**
Offline Offline

Posts: 42



« Reply #2 on: December 08, 2016, 02:32:55 PM »

Thanks. Have sent you a private message.
Logged
jonahh
Administrator
*****
Offline Offline

Posts: 23789



WWW
« Reply #3 on: December 09, 2016, 02:39:43 PM »

Thanks. In regards to the bullets not showing:

You can change it to the below but this will change it site wide too:

Code:
.module_round_box_outer ul, .moduletable ul {
    list-style: inside none disc;
}

editor.css line 10

If you want it to just change on the Masonry module add the following:

Code:
#s5_masondisplay_container ul {
    list-style: inside none disc !important;
}
Logged

Jonah Hall
------------
Shape 5 Team

- Need a great host for your website? We highly recommend siteground.com!


- Put your trust in the hands of our extremely qualified staff to get your job done right!


- Firebug is the most powerful web development and debugging tool, and it will save you a lot of time, frustration and forum questions:
Install Firebug
pjbg
Jr. Member
**
Offline Offline

Posts: 42



« Reply #4 on: December 10, 2016, 05:12:44 AM »

Thanks for this information.

However, neither CSS solution works for me when I insert the code into my custom.css file.

If I remove "none" from your code, I do get bullets but the second line of text returns to align under the bullets, rather than hanging in line with the beginning of the first line of text.

My understanding of CSS to achieve the correct hanging style (the default style as described above) is to either use "outside" or nothing at all. When I remove "none" and "inside" the bullets disappear all together.

Again, bullets work fine outside of the masonry module.

Am I doing something wrong - or is there a broader issue here?

Thanks,
Logged
jonahh
Administrator
*****
Offline Offline

Posts: 23789



WWW
« Reply #5 on: December 12, 2016, 01:15:42 PM »

I just took a look at your site and the article "Winner of the 2016 NCWSBA Broker Award Announced" is displaying the bullets for me fine. If you still have an issue try clearing your browser cache.
Logged

Jonah Hall
------------
Shape 5 Team

- Need a great host for your website? We highly recommend siteground.com!


- Put your trust in the hands of our extremely qualified staff to get your job done right!


- Firebug is the most powerful web development and debugging tool, and it will save you a lot of time, frustration and forum questions:
Install Firebug
pjbg
Jr. Member
**
Offline Offline

Posts: 42



« Reply #6 on: December 12, 2016, 02:42:57 PM »

I had removed "none" from your code so I do get bullets but the second line of text returns to align under the bullets (rather than hanging in line with the beginning of the first line of text). Which is not the way bullets are normally styled.

View the same article via the menu under news and you'll see the difference. Same article but delivered via the masonry module there is a style difference which I can't work out to solve.
Logged
jonahh
Administrator
*****
Offline Offline

Posts: 23789



WWW
« Reply #7 on: December 13, 2016, 12:36:45 PM »

They both look the same to me the only difference is the article in Masonry module has a small width so the text for the bullet drops to the next line. If you view the article in the news menu there is plenty of width for the bullets not to have their text drop or wrap to the next line.
Logged

Jonah Hall
------------
Shape 5 Team

- Need a great host for your website? We highly recommend siteground.com!


- Put your trust in the hands of our extremely qualified staff to get your job done right!


- Firebug is the most powerful web development and debugging tool, and it will save you a lot of time, frustration and forum questions:
Install Firebug
pjbg
Jr. Member
**
Offline Offline

Posts: 42



« Reply #8 on: December 13, 2016, 05:38:18 PM »

I'm sorry I may not have explained myself properly so please see 2 images attached. I've highlighted in yellow how the text behaves when it falls to the next line. Same article, same bullet coding, but the CSS behaves differently when viewed via the masonry module.

The only way to get bullets to actually show in masonry is to use "inside" in the custom CSS code. If "outside" is used (or leaving it blank which then is supposed to default to the "outside" style) no bullets show at all.

Meanwhile bullets show fine everywhere else on site.

I've also included a 3rd image which I generated from the W3 schools to help explain.

Thanks
Logged
jonahh
Administrator
*****
Offline Offline

Posts: 23789



WWW
« Reply #9 on: December 14, 2016, 12:56:49 PM »

Oh ok I understand, you would just need to change it to the below I believe

Code:
#s5_masondisplay_container ul {
    list-style: outside disc !important;
}

Also did you still want us to look into the Masonry module? I noticed your swapped it on your site to a different one.
Logged

Jonah Hall
------------
Shape 5 Team

- Need a great host for your website? We highly recommend siteground.com!


- Put your trust in the hands of our extremely qualified staff to get your job done right!


- Firebug is the most powerful web development and debugging tool, and it will save you a lot of time, frustration and forum questions:
Install Firebug
pjbg
Jr. Member
**
Offline Offline

Posts: 42



« Reply #10 on: December 14, 2016, 06:08:59 PM »

Oh ok I understand, you would just need to change it to the below I believe

Code:
#s5_masondisplay_container ul {
    list-style: outside disc !important;
}

Also did you still want us to look into the Masonry module? I noticed your swapped it on your site to a different one.

Yes, that's the code that I believe should work but doesn't in a masonry article. That is the problem.

I am trying out another module for the home page news but will still use the masonry elsewhere where these 2 minor and specific issues will not cause any problems.

Therefore I appreciate your assistance but if you don't want to spend any more time on this I understand.

Thanks again.
Logged
jonahh
Administrator
*****
Offline Offline

Posts: 23789



WWW
« Reply #11 on: December 15, 2016, 01:12:32 PM »

Ok I see the issue. This should fix the bullets to what you desire to see on Masonry module:

Code:
#s5_masondisplay_container ul {
    list-style: outside disc !important;
    margin-left: 15px;
}

Its up to you in regards to the Masonry dropping down when clicking the "all" button.  I just want to make sure you are happy. If you aren't I can dig into if further if not we can end it here then.
Logged

Jonah Hall
------------
Shape 5 Team

- Need a great host for your website? We highly recommend siteground.com!


- Put your trust in the hands of our extremely qualified staff to get your job done right!


- Firebug is the most powerful web development and debugging tool, and it will save you a lot of time, frustration and forum questions:
Install Firebug
pjbg
Jr. Member
**
Offline Offline

Posts: 42



« Reply #12 on: December 15, 2016, 04:33:58 PM »

That code fixed the bullet issue! Fantastic. Thank you. (actually 18px worked better; 15px cut off half the bullet).

Don't worry about the other issue for me: "Masonry dropping down when clicking the "all" button (but only when no images present)". I will work around this by not showing the category buttons up top when I use it.

Thanks again for your help. Smiley
Logged
jonahh
Administrator
*****
Offline Offline

Posts: 23789



WWW
« Reply #13 on: December 19, 2016, 01:36:47 PM »

Ok sounds good, let me know if you need any further help
Logged

Jonah Hall
------------
Shape 5 Team

- Need a great host for your website? We highly recommend siteground.com!


- Put your trust in the hands of our extremely qualified staff to get your job done right!


- Firebug is the most powerful web development and debugging tool, and it will save you a lot of time, frustration and forum questions:
Install Firebug
Pages: [1]
  Print  
 
Jump to:  

Powered by MySQL Powered by PHP Powered by SMF | SMF © 2013, Simple Machines
Joomla Bridge by JoomlaHacks.com
Valid XHTML 1.0! Valid CSS!
Looking for the largest variety in template designs? Look no more. Never buy 1 theme again. Signups start at just $89 for access to all of our themes.
Send Us An Email
Please send us your questions and we will email you back as soon as we can. Product support questions should be posted in our support forums under the Help menu. Our staff will assist you from there.