SitePoint Sponsor

User Tag List

Results 1 to 2 of 2
  1. #1
    SitePoint Enthusiast MartyBoi's Avatar
    Join Date
    Dec 2011
    Location
    Saginaw MI
    Posts
    53
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)

    Question (-webkit-box-shadow:inset) not working in Chrome....

    Hello, can't get (-webkit-box-shadow:inset) to work in Chrome.... Help !

    Code:
    header input[type='search'] {
    	border: 1px solid #000;
    	box-shadow:inset 2px 2px 5px #202020; /* CSS3 */	
    	-moz-box-shadow:inset 2px 2px 5px #202020; /* Firefox */
    	-webkit-box-shadow:inset 2px 2px 5px #202020; /* Safari, Chrome */		
    	font-size: 1.4em;
    	height: 28px;
    	padding: 0 5px 0;
    	width: 200px;		
    }
    Thank you....

  2. #2
    The CSS Clinic is open silver trophybronze trophy
    Paul O'B's Avatar
    Join Date
    Jan 2003
    Location
    Hampshire UK
    Posts
    40,350
    Mentioned
    179 Post(s)
    Tagged
    6 Thread(s)
    The input type="search doesn't allow the box shadow to work. Input type=text is ok but "search" isn't.

    You can try adding -webkit-appearance:none and it should allow the shadow to apply but may change how the element looks.

    Code:
    input[type="search"] {
    	border: 1px solid #000;
    	-moz-box-shadow:inset 2px 2px 5px #202020; /* Firefox */
    	-webkit-box-shadow:inset 2px 2px 5px #202020; /* Safari, Chrome */
    	box-shadow:inset 2px 2px 5px #202020; /* CSS3 */
    	font-size: 1.4em;
    	height: 28px;
    	padding: 0 5px 0;
    	width: 200px;
    	border:none;
    	-webkit-appearance:none;
    }


Bookmarks

Posting Permissions

  • You may not post new threads
  • You may not post replies
  • You may not post attachments
  • You may not edit your posts
  •