Joomla Templates Club 406,261 posts

[global21 Friend global21Join date: March 2011Posts: 134Downloads:37Uploads:43 Thanks: 31 Thanked: 5 times in 3 posts]

#193772

Hi,

I have converted my development template over to a “sticky menu” setup and i have followed the instructions in a previous solved thread: http://www.joomlart.com/forums/topic/no-sticky-menu-in-beranis/

This worked perfectly, however my main body page then shifted completely up under the menu bar and the main page title was hidden behind it. So i thought i had done the correct custom css change to bring it back into line but i have noticed on my mobile version i have a huge gap between the menu and the page title. Which means i have obviously done the incorrect css changes and i would like to know where i have gone wrong and what is the correct way to do it.

I have attached the two screen shots and included the custom css change that i made.

site url: http://dev.digitalenigma.co.uk/digitalenigma/


.t3-mainbody {
padding-bottom: 40px;
padding-top: 100px; (i believe this used to be 40px)
}


---

Attachments:

1. 
2. 

[Css Magician Friend Css MagicianJoin date: October 2014Posts: 741Downloads:43Uploads:53 Thanks: 114 Thanked: 366 times in 263 posts]

#518629

@global21,

I detected an error in your http://dev.digitalenigma.co.uk/digitalenigma/templates/ja_beranis/css/custom.css file, see the css rule:


/* align navigation to the right on all screens large enough to accommodate logo and navigation on the same line */
@media (min-width: 1185px) {
#t3-header .row .span10 {
float: right;
}
/*end logo*/


You missed to add } the close the rule below:

@media (min-width: 1185px) {


Please check again.

[global21 Friend global21Join date: March 2011Posts: 134Downloads:37Uploads:43 Thanks: 31 Thanked: 5 times in 3 posts]

#518732

Hi,

Thanks for getting back to me.

Ok i have closed the bracket – but that hasnt change anything for me.

Still have a huge space between the page title and menu on the mobile version?

where have i gone wrong?

[Css Magician Friend Css MagicianJoin date: October 2014Posts: 741Downloads:43Uploads:53 Thanks: 114 Thanked: 366 times in 263 posts]

#518770

@global21, Please PM me FTP credentials of your site, I will help to check the root of issue.

[global21 Friend global21Join date: March 2011Posts: 134Downloads:37Uploads:43 Thanks: 31 Thanked: 5 times in 3 posts]

#518901

i have sent all the details to you.

[bcollie Friend bcollieJoin date: February 2010Posts: 28Downloads:0Uploads:4 Thanks: 6 Thanked: 1 times in 1 posts]

#519526

+1
Exactly the same problem with large white space between Main menu and content on the mobile phone
Tried turning off all the position fields in the layout menu but didn’t help

[global21 Friend global21Join date: March 2011Posts: 134Downloads:37Uploads:43 Thanks: 31 Thanked: 5 times in 3 posts]

#519537

@bcollie @Css Magician

hi,

Css Magician asked for backend access which i granted and he sorted out but he hasn’t put the solution up so he should see this post and hopefully post the solution.

I have pm him because i didnt make this post solved and only noticed everything had been sorted when you posted on here.

Lets hope it gets posted soon.

stef.

[Css Magician Friend Css MagicianJoin date: October 2014Posts: 741Downloads:43Uploads:53 Thanks: 114 Thanked: 366 times in 263 posts]

#519612

@global21 , @bcollie

I added css rule in templatesja_beraniscsscustom.css file:

@media (max-width: 767px) {
.t3-mainbody {
padding-top: 0;
}

#t3-header {
padding: 0;
}
}


and replaced

@media (min-width: 768px) and (max-width: 979px) {
.t3-mainnav {
width: 100% !important;
}
.t3-mainnav .navbar {
float: left;
}
}


with

@media (min-width: 768px) and (max-width: 979px) {
.t3-mainnav {
}
.t3-mainnav .navbar {
float: left;
}
}


in templatesja_beraniscsstemplate-responsive.css file.

Hope that helps.

1 user says Thank You to Css Magician for this useful post

1. bcollie

[Author]

Posts