diff --git a/Base/res/html/misc/opacity.html b/Base/res/html/misc/opacity.html index 4dfa51770c..8a8154807a 100644 --- a/Base/res/html/misc/opacity.html +++ b/Base/res/html/misc/opacity.html @@ -24,6 +24,13 @@ .red { background: red; } + .hover-visible { + display: inline-block; + opacity: 0; + } + .hover:hover .hover-visible { + opacity: 1; + } @@ -66,5 +73,13 @@ 50% opacity inside 70% opacity + +
+ Visible on hover + +
+ I'm visible! +
+
diff --git a/Userland/Libraries/LibWeb/Layout/Node.cpp b/Userland/Libraries/LibWeb/Layout/Node.cpp index 5125b0d769..54d2217dcd 100644 --- a/Userland/Libraries/LibWeb/Layout/Node.cpp +++ b/Userland/Libraries/LibWeb/Layout/Node.cpp @@ -487,8 +487,7 @@ void NodeWithStyle::apply_style(const CSS::StyleProperties& computed_style) if (auto maybe_visibility = computed_style.visibility(); maybe_visibility.has_value()) computed_values.set_visibility(maybe_visibility.release_value()); - if (computed_values.opacity() == 0 || computed_values.visibility() != CSS::Visibility::Visible) - m_visible = false; + m_visible = computed_values.opacity() != 0 && computed_values.visibility() == CSS::Visibility::Visible; if (auto maybe_length_percentage = computed_style.length_percentage(CSS::PropertyID::Width); maybe_length_percentage.has_value()) computed_values.set_width(maybe_length_percentage.release_value());