Skip navigation
skeeterz71xxx 167 posts
Nov 5, 2012
Currently Being Moderated

Text not adjusting right in smartphone view

May 6, 2013 10:38 PM

I am attempting to build a website using DW fluid grid layout. The issue I am having is with the text in my navBar. In desktop and tablet view, the nav text displays ok. When in smartphone view, the text is not aligning correctly when stacked. I’m not sure what to do in the CSS. It is a UL set to display inline right now.

 

 

Any ideas?

 

cm_issues.png

 
Replies
  • Currently Being Moderated
    May 7, 2013 4:32 AM   in reply to skeeterz71xxx

    It would be better to give us a link to your site so that we can see the problem in situ.

     
    |
    Mark as:
  • Currently Being Moderated
    May 7, 2013 9:47 AM   in reply to skeeterz71xxx

    I would add the highlighted to the CSS

    #container #header #navBar ul li {

        display: inline-block;

        text-transform: uppercase;

        padding-right: 40px;

        padding-left: 0px;

        background-position: 0px;

        padding-top: 11px;

        margin: 0px;

    }

    @media all and (max-width: 629px) {

        #container #header #navBar ul li {

        width: 100%;

      }

    }

    This also has the effect that a person with fat fingers (me) can easily find the menu buttons on a small screen.

     
    |
    Mark as:

More Like This

  • Retrieving data ...

Bookmarked By (0)

Answers + Points = Status

  • 10 points awarded for Correct Answers
  • 5 points awarded for Helpful Answers
  • 10,000+ points
  • 1,001-10,000 points
  • 501-1,000 points
  • 5-500 points