• Karen Snyder

  • 2020년 10월 27일 23:26

  Community Moderator

  seoj this sounds like it's happening due to the smaller width of mobile screens. You can use CSS media queries to change the width of the elements according to the width of the screen.

  You need to use developer tools to inspect the elements and find out the classes/IDs of the elements. If they don't have a class or ID, you would have to modify header.hbs to assign it.

  For an example of a media query, if the search bar class is search-container and the logo class is logo-container, you could use the following media queries to control the width:

  @media screen and (max-width: 420px) {
  
        logo-url {
             width: 30%;
        }
  
         .search-container {
             width: 30%;
        }
  }

  This is just an example, and it all depends on your individual element layout and which screen widths have the problem with the widths.

   

• seoj

  • 2020년 10월 28일 07:58

  Thank you, Karen. This helped me figure out the linked style sheet and I changed the width to 400px looks fine.

   

댓글을 남기려면 로그인하세요.