Jump to content

Archived

This topic is now archived and is closed to further replies.

rmhardwick

Nav Bar Collasping and Breaking menu - Media Queries for Menu

Recommended Posts

rmhardwick

Trying to fix a problem with the navbar collasping, seem like it dropping the navbar without swtiching over to the mobile menu. As soon as it hit 1039px, it breaks. Where can I find and what are the media queries and what is the class to fix this issue? I'm using the latest version of DMS.

 

Before it's broken: 1039px

 

[attachment=1799:before.jpg]

 

 

After: 1020px

 

[attachment=1800:after.jpg]

 

Any help in fix this issue and also maybe the issue of the headline being covered up would be appreciated.

Share this post


Link to post
Share on other sites
James B

Hi there, try the two snippets below, edit the figures to suit.

 

@media (max-width:2500px){

.navbar .navline{
    display:none;
  }}

  @media (max-width: 2500px){
#site .navbar .nav-btn-navbar {
display: inline-block;
  }}


Kindly search the forum and read the documentation before posting. It will help you resolve many issues.

For CSS help be sure to check out W3Schools first and be sure to download FireBug for FireFox for troubleshooting.

James B

Share this post


Link to post
Share on other sites
rmhardwick

Thanks James that worked awesome.

 

Now that's resolved any chance in pointing me in the right direction with the slider text that is getting hidden. Is there some way make that section viewable on mobile, tablet, while keeping on looking the same on desktop?

Share this post


Link to post
Share on other sites
Danny

The slider text shouldn't be hidden unless you have added custom styling to it, which is effecting it. Can you provide a link to the site please.


Please search our forums, before posting!

Share this post


Link to post
Share on other sites
rmhardwick

it's under devel right now and locked down. can I pass you a private link with user and pw?

Share this post


Link to post
Share on other sites
Danny

Yeah send me access via email to danny at pagelines dot com


Please search our forums, before posting!

Share this post


Link to post
Share on other sites
Danny

OK, the RevSlider text via the Slide text field, has a specific width, so to resolve your issue, use the following:

 

YOU MAKE IT POSSIBLE.<br />Read Our 2012-13<br /> Annual Report.

 

Which will look like this:

 

http://d.pr/i/2Ykm

http://d.pr/i/M43G

 

#2 on your email this is your custom code in a text widget, therefore, if you wish to have that text respond a specific way, you will want to either use the PL grid or use your own custom CSS to style how you like. You can find more info regarding the PL grid here - http://docs.pagelines.com/tutorials/responsive-grid

 

#3 Add the following code, this should resolve the issue.

 

#site .hentry-pad {
padding: 0 15px;
}

 

#4 Not sure what you mean, can you go into greater detail.

Also, please refrain from asking multiple questions which have no relation to your issue from this topic. Our forum policy is one question per topic, this is for indexing reasons.


Please search our forums, before posting!

Share this post


Link to post
Share on other sites
rmhardwick

Thanks Danny. It all worked. #4 was my fault changed a label to white.

 

I'm sorry for posting multiple issues. next time, I will post separately.

 

Again thanks for the speedy reply.

Share this post


Link to post
Share on other sites
greenfly

Thanks for letting us know it worked


The answer to many issues can be found by searching in the forum before posting as someone else  may very well have had the same problem before you have.  Also, reading the documentation can help you gain a good understanding of how everything works. 

 

Please do not send me private messages. Occam's razor - The principle states "Keep things simple!"

Share this post


Link to post
Share on other sites

×