Joomla Templates Club 406,261 posts

[icandy_webs Friend icandy_websJoin date: February 2014Posts: 82Downloads:1Uploads:8 Thanks: 11 Thanked: 12 times in 1 posts]

#199825

For some odd reason, the Masshead module seems have issues displaying. So far I have been able to analyze that it only spans the entire width of the page as its supposed to if I scroll down and the Main menu nav no longer shows. It will also span the entire width if I resize the page less than 1200px. Any suggestions as to what could be causing this? It only seems to be an issue in Firefox.

[yangyangli Friend yangyangliJoin date: July 2014Posts: 72Downloads:0Uploads:39 Thanks: 22 Thanked: 12 times in 1 posts]

#542924

@icandy_webs
Based on the problem you describe, that the masshead module is not spanning the browser width correctly and that the problem only occurs in Firefox, I believe it is a browser version issue. You say that the span fluctuates depending on scroll status and browser window width which is controlled by nav-bar and @media css. Some older browser versions do not support HTML 5 and CSS 3. What version of Firefox are you using? Hope this helped!

[icandy_webs Friend icandy_websJoin date: February 2014Posts: 82Downloads:1Uploads:8 Thanks: 11 Thanked: 12 times in 1 posts]

#542925

hey @yangyangli. Thanks for your reply. Thats exactly what I thought too but here’s the weird thing. The JoomlArt’s template demo looks perfectly fine when I test it on Firefox and I am using the latest version (v30.0). So I am not sure if it’s a problem with the browser or possibly a change I made to the variable.less file. Not sure what to test next…

[yangyangli Friend yangyangliJoin date: July 2014Posts: 72Downloads:0Uploads:39 Thanks: 22 Thanked: 12 times in 1 posts]

#542926

@icandy_webs
This sounds interesting. If you could post a screenshot of the issue it would help. Try running the official Sugite template in your browser and see if the problem persists. http://www.joomlart.com/demo/#ja_sugite

[icandy_webs Friend icandy_websJoin date: February 2014Posts: 82Downloads:1Uploads:8 Thanks: 11 Thanked: 12 times in 1 posts]

#542927

@yangyangli

sure as a matter of fact, I will take my site off of offline mode for a moment for you to see it. Maybe you can tell me if you see it in your browser too. Another weird thing I’ve found out is that I disabled the logo from spinning via css, however only in firefox it still spins but only on the transition out. That I can probably fix as soon as I can find the appropriate selector and property to assign to it. Check your PM for the URL.

[yangyangli Friend yangyangliJoin date: July 2014Posts: 72Downloads:0Uploads:39 Thanks: 22 Thanked: 12 times in 1 posts]

#542930

I’ve took a look at your site using 4 different browser engines including moz (Firefox). Lo and behold, Firefox does something weird…

The problem does not appear on my website…

…nor does it appear on the default installation.

Most likely, you modified some element and that’s causing the issue. Hopefully you can have a Moderator tell you what’s broke. In the meantime, I would suggest running a difference comparison between your template.css and a unmodified version and see if you added/deleted a semicolon somewhere.
Hope this helped!

---

Attachments:

1. 
2. 
3. 

1 user says Thank You to yangyangli for this useful post

1. icandy_webs

[icandy_webs Friend icandy_websJoin date: February 2014Posts: 82Downloads:1Uploads:8 Thanks: 11 Thanked: 12 times in 1 posts]

#542931

Sure enough, you were right with it being a confliction with my css, but not sure why. Firefox doesn’t like this style that i applied to the t3-header. Thanks for your help, now to figure out a work around.

.t3-header {
max-height: 90px;
}

[yangyangli Friend yangyangliJoin date: July 2014Posts: 72Downloads:0Uploads:39 Thanks: 22 Thanked: 12 times in 1 posts]

#542934

Great that you managed to engineer a workaround! Your site looks fabulous by the way, I’m jealous. The custom transitions you added to your JA Slideshow are amazing 🙂

[icandy_webs Friend icandy_websJoin date: February 2014Posts: 82Downloads:1Uploads:8 Thanks: 11 Thanked: 12 times in 1 posts]

#542935

Thanks! Lol it has definitely been a work in progress, especially because some things in Joomla aren’t as straight forward as they should be. It’s actually not JA Slideshow. As a matter of fact, I’m not really a fan of the JA Slideshow.

For this site, I used one of my favorites called Smart Slider 2 by NextEndWeb. It’s not free and there’s a small learning curve (as with every extension lol) but the end results are completely worth it. Check it out by clicking here

If you need any help setting it up or have any questions let me know.

1 user says Thank You to icandy_webs for this useful post

1. yangyangli

[yangyangli Friend yangyangliJoin date: July 2014Posts: 72Downloads:0Uploads:39 Thanks: 22 Thanked: 12 times in 1 posts]

#542938

Thanks for the suggestion. I’ve spent much more time than I should have on JA Slideshow to make it work. I will keep Smart Slider 2 in mind for my next project.

I don’t think JA Slideshow has that many fans. Half the posts on this forum are related to that plugin. The Joomlart devs really need to make it responsive which I see Smart Slider 2 is.

Thanks again for all the help!

[icandy_webs Friend icandy_websJoin date: February 2014Posts: 82Downloads:1Uploads:8 Thanks: 11 Thanked: 12 times in 1 posts]

#543027

No Problem, could a JA Moderator give me some insight as to why Firefox doesn’t like the .t3-header class to be given a fixed width? I have tried to work around this by solely targeting Firefox browsers and adding this to my custom.css file:

@-moz-document url-prefix() {
.t3-header {
height: 90px !important;
}
}

Basically I do not want the header to expand more than 90px in height. For some reason, firefox doesn’t like it and the only way Masshead will behave is if I either get rid of:


.t3-header {
height: 90px !important;
}


or set height >= 115px;

[icandy_webs Friend icandy_websJoin date: February 2014Posts: 82Downloads:1Uploads:8 Thanks: 11 Thanked: 12 times in 1 posts]

#543573

still awaiting a possible fix or response

[Ninja Lead Moderator Ninja LeadJoin date: November 2014Posts: 16064Downloads:310Uploads:2864 Thanks: 341 Thanked: 3854 times in 3563 posts]

#543763

<em>@icandy_webs 438336 wrote:</em><blockquote>still awaiting a possible fix or response</blockquote>

My solution will help you to fix the problem on FireFox browser and full width in JA Masshead module

+ Open templates/ja_sugite/css/custom.css file and add new rule


.ja-masthead {
overflow: auto !important;
}

.ja-masthead .container {
width: 100% !important;
}


Let me know if it helps

[icandy_webs Friend icandy_websJoin date: February 2014Posts: 82Downloads:1Uploads:8 Thanks: 11 Thanked: 12 times in 1 posts]

#543842

Hi @ninja Lead,

Thanks for your assistance. Unfortunately, this did not fix the issue. It seems to only exist when the t3-header shows up as you are scrolling up. The only way that it seems to work is if I allow it to have it’s height set to auto which I do not want it to exceed more than 95px in height. It’s very weird because it’s only in Firefox.

[Ninja Lead Moderator Ninja LeadJoin date: November 2014Posts: 16064Downloads:310Uploads:2864 Thanks: 341 Thanked: 3854 times in 3563 posts]

#543854

I have fixed the problem of your request directly on your site. Please look at the screenshot from your site in Web Design page.

Let me know if this helps

---

Attachments:

1. 

[Author]

Posts