Joomla Templates Club 406,261 posts

[hjalte1983 Friend hjalte1983Join date: September 2012Posts: 328Downloads:7Uploads:105 Thanks: 101 Thanked: 9 times in 1 posts]

#554100

Lost the last couple of post here. @saguaros can you remember what my issue was? , with the sticky menu not working correct in responsive. you asked me for site login etc,
You got that ?

Or do i need to describe it again and send login info ?

[Saguaros Moderator SaguarosJoin date: September 2014Posts: 31405Downloads:237Uploads:471 Thanks: 845 Thanked: 5346 times in 4964 posts]

#554105

We are sorry for the data lost, could you pls send me again the info?

[hjalte1983 Friend hjalte1983Join date: September 2012Posts: 328Downloads:7Uploads:105 Thanks: 101 Thanked: 9 times in 1 posts]

#554117

Okay, heres some screenshots.
The Sticky Menu doesnt work on a tablet, phone.. etc.
try to minimize your browser and you see the issues start.

Pm sent with login details.

---

Attachments:

1. 
2. 

[Saguaros Moderator SaguarosJoin date: September 2014Posts: 31405Downloads:237Uploads:471 Thanks: 845 Thanked: 5346 times in 4964 posts]

#554209

I just added this CSS rule into ‘custom.css’ file:


@media screen and (min-width: 768px) and (max-width: 990px) {

.navbar-header {

position: fixed;

width: 100%;

}
}


[hjalte1983 Friend hjalte1983Join date: September 2012Posts: 328Downloads:7Uploads:105 Thanks: 101 Thanked: 9 times in 1 posts]

#554270

I can’t see any changes ?

[Saguaros Moderator SaguarosJoin date: September 2014Posts: 31405Downloads:237Uploads:471 Thanks: 845 Thanked: 5346 times in 4964 posts]

#554340

Which mobile device are you testing?

[hjalte1983 Friend hjalte1983Join date: September 2012Posts: 328Downloads:7Uploads:105 Thanks: 101 Thanked: 9 times in 1 posts]

#554366

Samsung galaxy s4
iphone 4
ipad 3. Generation

[networkme Friend networkmeJoin date: August 2014Posts: 9Downloads:0Uploads:3]

#554578

Just add to custom.css:

.t3-header { position: fixed; }

.t3-masthead { padding-top: 80px; }

[hjalte1983 Friend hjalte1983Join date: September 2012Posts: 328Downloads:7Uploads:105 Thanks: 101 Thanked: 9 times in 1 posts]

#554632

hi @networkme this code did not fix the issues.

[Saguaros Moderator SaguarosJoin date: September 2014Posts: 31405Downloads:237Uploads:471 Thanks: 845 Thanked: 5346 times in 4964 posts]

#554738

I just edit the ‘custom.css’ file, pls check again and let me know how it goes.

[hjalte1983 Friend hjalte1983Join date: September 2012Posts: 328Downloads:7Uploads:105 Thanks: 101 Thanked: 9 times in 1 posts]

#554754

Hi @saguaros The menu bar seems to work now, thank you.

But it do chop some of my slider now.
see screenshot:

Also the menu icon goes in behind the menu bar, so its not showing on smaller screens.

Regards.

---

Attachments:

1. 
2. 

[Saguaros Moderator SaguarosJoin date: September 2014Posts: 31405Downloads:237Uploads:471 Thanks: 845 Thanked: 5346 times in 4964 posts]

#554835

I just added this rule for the slide on your site:


.container.t3-masthead {
margin-top: 45px;
}


With the off-canvas button, pls take a look at the css I added yesterday:


.navbar-header.affix {
position: fixed;
top: 0;
left: auto;
right: 25px;
display: inline-block !important;
}


and try to increase value for the ‘right’ and check on your device again.

[hjalte1983 Friend hjalte1983Join date: September 2012Posts: 328Downloads:7Uploads:105 Thanks: 101 Thanked: 9 times in 1 posts]

#554851

Hi @saguaros
Its not only the slider that got the issue, every page have margin issue

.container.t3-masthead {
margin-top: 45px;
}


contact, products pages, checkout, etc etc.

.navbar-header.affix {
position: fixed;
top: 0;
left: auto;
right: 25px;
display: inline-block !important;
}

Don’t think its a position issue, it just get hidden behind the menu bar, doesn’t help anything changing the pixels.

[networkme Friend networkmeJoin date: August 2014Posts: 9Downloads:0Uploads:3]

#554870

if ity goes behind the menu bar just add to .navbar-header.affix

z-index: 5 (i think the mainnav has 3 so it will be displayed on top.

[hjalte1983 Friend hjalte1983Join date: September 2012Posts: 328Downloads:7Uploads:105 Thanks: 101 Thanked: 9 times in 1 posts]

#555754

Added z-index: 5; to the .navbar-header.affix and that helped with the menu icon.

But the main issue is still there @saguaros do you have a fix for this ?

[Author]

Posts