Home/ Questions/Q 7641639
In Process

The Archive Base Latest Questions

Editorial Team
  • 0
Asked: 2026-05-31T08:58:32+00:00

<html> <head> <style type=text/css> div { -moz-box-shadow: 0 10px 10px hsla(0, 0%, 0%, .2);

  • 0
<html>

    <head>
        <style type="text/css">
            div {
                -moz-box-shadow: 0 10px 10px hsla(0, 0%, 0%, .2);
                -webkit-box-shadow: 0 10px 30px hsla(0, 0%, 0%, .2);
                box-shadow: 0 10px 30px hsla(0, 0%, 0%, .2);
            }
            div:hover {
                width:200px;
                background-color:red;
            }
        </style>
    </head>

    <body>
        <? $dynamic_width=800; ?>
            <div style=" width:<? echo $dynamic_width;?>px;">hover selector style links on mouse-over.
                <div>
    </body>

</html>

In above code the width of div: hover not changes with mouseover. div width should change according to “$dynamic_width” veriable and on mouse over it should be 200px

Share

Leave an answer

You must login to add an answer.

Need An Account,

1 Answer

  1. Editorial Team

    As the element style takes precedence over a more general style, the 200px from the :hover pseudo class are never applied.

    Try:

    div:hover
{
    width: 200px !important;
    background-color:red;
}​

    demo: http://jsfiddle.net/bn2Sc/1/

    • 0