On Mon, Nov 28, 2011 at 17:36, Paceaux <pace...@madebypaceaux.com> wrote:

> There's another CSS3 trick you can try, but I don't think it has as wide
> support as the box-shadow trick. You *do* add border and outline, and then
> apply outline-offset:
>
> border: 1px solid #444;
> outline: 3px solid #444;
> outline-offset: 3px;
>

Just a word of warning to anyone using outline and Opera: Opera renders the
outline on top of everything, even if it would normally be invisible.  This
makes outline useless to anyone with a complex layout who cares about Opera
support.

Sample:

<style>
    #a, #b {
      height: 100px;
      width: 100px;
      position: absolute;
      border: 1px solid green;
    }
    #b {
      border: 1px inset red;
      background-color: blue;
    }
    #aa {
      margin: 30px auto;
      height: 40px;
      width: 40px;
      background-color: pink;
      outline: 1px solid pink;
    }
    </style>
  </head>
  <body>
    <div id="a"><div id="aa"></div></div>
    <div id="b"></div>
  </body>
______________________________________________________________________
css-discuss [css-d@lists.css-discuss.org]
http://www.css-discuss.org/mailman/listinfo/css-d
List wiki/FAQ -- http://css-discuss.incutio.com/
List policies -- http://css-discuss.org/policies.html
Supported by evolt.org -- http://www.evolt.org/help_support_evolt/

Reply via email to