I’m a newbie who just completed the Astro Law Firm tutorial and found a few bugs throughout the process:
Sometimes elements would just disappear from view, after I made a style adjustment. They were still there in the navigator, but I could not see them. I would then try styling with different colours to see if it would show up, to no avail. These elements were mostly divs and text blocks. My only solution was to delete the object and recreate one, applying the classes the original object had. Then everything was visible again.
At the end of the tutorial, there is an issue with cascading styles. On deskop, we duplicated the home hero and applied interactions to one of them. Afterwards, the interaction hero was set to display on desktop only. Conversely, the original hero was set to display only on tablet and mobile.
However, when switching to tablet mode, which should’ve shown the original hero without interactions, it showed the “appearance” of the interaction hero, but without the interactions themselves. Namely, the added images of clouds, plus the bright galaxy image was at the forefront.
In mobile view, everything looked as though it should.
So in short, the styles set on desktop did not cascade to tablet.
Hi @bellybuckle Thanks for posting this, this definitely sounds like odd behavior. Most likely there are some browser extensions causing the inconsistencies which you noted but it’s very difficult to tell without more information.
Please send me screenshots of the behavior you’re describing.
As for issue #1: I would have to come across it again and then post here.
As for issue #2, the style difference still doesn’t make sense if what I set on desktop is suppose to cascade. The “home hero” section, which is hidden on desktop, has an overlay and doesn’t have the clouds on top. This is the version that should be showing on tablet, but is not. Instead, tablet is showing the “home hero interactions” version (with clouds and missing overlay) but minus the interactions themselves.
Yes, I could easily go into tablet mode and restyle to match the mobile views, but it’s the cascading component that doesn’t seem to be working in this situation.
Thoughts?
B.
P.S. Check out the nav in the panel at right: the tablet is showing the clouds that are only in the rotator div, which houses the interactions on desktop. They shouldn’t be showing on tablet at all, but they are.
From what I can tell all styles are cascading down correctly. In this case, the only difference I can see is that the overlay was added to the mobile landscape, rather than the tablet version — so you will need to add that overlay to the tablet version manually.
Thanks so much. It’s been a while since I’ve been on these forums so my apologies it’s taken this long to get back to you.
Okay, I can see the way to fix things, as you have illustrated. It still baffles me, however, that I followed the tut so closely and the styles didn’t get applied as they should’ve. So could this be a bug?
I don’t think this is a bug. It appears that all styles cascaded correctly, but there were just a couple of styles missing from one of the instances. Once that’s addressed the issue should be resolved!
