Hi everyone. For some reason I am having trouble resizing the Logo for different breakpoints. My understanding is that I should be able to resize the Logo for each breakpoint without having to add sub classes, is that correct? Well, changing the Logo size, say in mobile landscape will change the Logo size for all breakpoints. Any idea what the problem could be? I have even tried creating sub classes for the different breakpoints, still doesn’t work. Am I doing something wrong or is there a bug that is causing this? My NavBar is a symbol right now, could that be the problem since there seams to be a problem with symbols out there as I have read in other threads or what is the deal here? Would appreciate help on this. Thanks in advance.
In addition to that, the sub classes that I have created even disappeared on me a few times. Just reassigns an image class to the Logo image automatically somehow. Weird
You don’t need subclasses. Just add a style to your image and go to the different breakpoint and change the width and it will change from that breakpoint and smaller. You can also avoid a lot of this by applying your width into a percentage instead of a px size. Then it’s completely fluid. I usually size my logo for desktop and leave it then apply a percentage from tablet and below, say 50% of the parent container for a hero logo then do like 75% on the smaller breakpoints.
This sounds like expected behavior, but feel free to reach out if this isn’t what you’re talking about.
In short, making a change in image settings — whether it’s manually entering a value or dragging from the bottom-right corner to resize — is affecting the HTML only. In other words, you’re affecting the element itself and not the class.
To change something based on the breakpoint, you’ll have to add a class to the element, then make any dimension changes in the styles panel.
Demo of both behaviors below. You’ll see that changing image settings in any breakpoint will affect all breakpoints, while changing dimensions in the styles panel will let you style per-breakpoint.
Thanks so much everyone. I didn’t realize that the image settings and the styles panel are not the same thing, in terms of html and css. That cleared it right up. everything is working great. Thanks so much for the clear instructions and also a video, awesome.
