logo mobile view
our main page has a logo that overlaps with the search bar in the mobile view. I think header.hbs control it, how do I fix this overlap. We use a Copenhagen theme
-
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.
-
Thank you, Karen. This helped me figure out the linked style sheet and I changed the width to 400px looks fine.
댓글을 남기려면 로그인하세요.
2 댓글