Joomla Templates Club 406,261 posts

[Pankaj Sharma Moderator Pankaj SharmaJoin date: February 2015Posts: 24589Downloads:144Uploads:202 Thanks: 127 Thanked: 4196 times in 4019 posts]

#895399

Hi
This is because the logo size is too big and its overlapping on the main nav .
Find this code

  .scrollUp .t3-mainnav {
    padding-top: 60px;
  }

replace it with

  .scrollUp .t3-mainnav {
    padding-top: 220px;
  }

Then find this code Near line 1382

.t3-mainnav {
    border-left: 0;
    border-right: 0;
    border-radius: 0;
    margin-bottom: 0;
    position: fixed;
    padding-top: 120px;
    top: 0;
    left: 0;
    width: 100%;
    z-index: 1029;
    transform: translateY(0);
    -webkit-transform: translateY(0);
    transition: transform 400ms, padding-top 400ms;
}

Replace it with

.t3-mainnav {
    border-left: 0;
    border-right: 0;
    border-radius: 0;
    margin-bottom: 0;
    position: fixed;
    padding-top: 220px;
    top: 0;
    left: 0;
    width: 100%;
    z-index: 1029;
    transform: translateY(0);
    -webkit-transform: translateY(0);
    transition: transform 400ms, padding-top 400ms;
}

save file and check . You can see the main navigation after these changes .

[patvandenbosche Friend patvandenboscheJoin date: March 2006Posts: 132Downloads:47Uploads:37 Thanks: 34 Thanked: 5 times in 2 posts]

#895512

Thank you for your response, but this only partially fixed the problem. I copied the correct code into my custom.css file, and it fixed the issue of the main menu showing, but only in a full screen. When you check for a smaller screen, the same issue appears with the main menu missing.

Additionally, while the main menu appears in the full screen, the top of the first image and top of the banner on the right side (position: leading-sidebar) are cut off.

So the fix needs to apply to the smaller screen, and the top of the main section needs to be adjusted.

I have attached screen shots to further explain what I am looking for.

Thank you.

---

Attachments:

1. 
2. 

Pat Vanden Bosche
www.patvb.com

[patvandenbosche Friend patvandenboscheJoin date: March 2006Posts: 132Downloads:47Uploads:37 Thanks: 34 Thanked: 5 times in 2 posts]

#895572

Another issue is the top of an article is covered by the main menu, as can be seen at Mayors & Commissioners page.

Image attached for this page.

---

Attachments:

1. 

Pat Vanden Bosche
www.patvb.com

[Pankaj Sharma Moderator Pankaj SharmaJoin date: February 2015Posts: 24589Downloads:144Uploads:202 Thanks: 127 Thanked: 4196 times in 4019 posts]

#895688

Hi
when the screen size is decrease the menu is moved into the toggle menu (left sidebar menu) .
You can check the same in the demo site .
For the hiding the content issue add below code in custom.csss file

@media(min-width:980px) {.t3-mainbody {
    padding-top: 120px;
}}

Hope it helps .

[patvandenbosche Friend patvandenboscheJoin date: March 2006Posts: 132Downloads:47Uploads:37 Thanks: 34 Thanked: 5 times in 2 posts]

#895757

Thank you, this fixed the full size screen issue with the top of the body chopped off, but in a smaller screen, the same issue still remains, the top of the sidebar and the main body are chopped off. See attached image.

---

Attachments:

1. 

Pat Vanden Bosche
www.patvb.com

[Pankaj Sharma Moderator Pankaj SharmaJoin date: February 2015Posts: 24589Downloads:144Uploads:202 Thanks: 127 Thanked: 4196 times in 4019 posts]

#895761

Hi
it happen due the you added the code in custom.css file that i suggested in first post .
Do the following work .
Go to custom.css file
find this code

/* Modify logo size */
/* main screen */
.scrollUp .t3-mainnav { 
   padding-top: 220px; 
} 

.t3-mainnav {
  border-left: 0; 
  border-right: 0; 
  border-radius: 0; 
  margin-bottom: 0; 
  position: fixed; 
  padding-top: 220px; 
  top: 0; left: 0; 
  width: 100%; 
  z-index: 1029; 
  transform: translateY(0); 
  -webkit-transform: translateY(0); 
  transition: transform 400ms, padding-top 400ms; 
}

replace it with

@media (min-width:1200px) {
.scrollUp .t3-mainnav {    padding-top: 220px;  } 
.t3-mainnav {  padding-top: 220px;  }}

1 user says Thank You to Pankaj Sharma for this useful post

1. patvandenbosche

[patvandenbosche Friend patvandenboscheJoin date: March 2006Posts: 132Downloads:47Uploads:37 Thanks: 34 Thanked: 5 times in 2 posts]

#896745

No, you didn’t say to put the code into the custom.css file, but I sure didn’t want to lose anything when the template might be upgraded. I always put changes into the custom.css file. I’ve modified the changes in my custom.css file now, and it all works perfectly.

Thank you so much!

Pat

Pat Vanden Bosche
www.patvb.com

[Author]

Posts