Jump to content


Photo
- - - - -

Need CSS snippet to reduce the radius of the default "Search" box in the header.


  • Please log in to reply
3 replies to this topic

#1 SteinVox

SteinVox

    Member

  • Members
  • 23 posts
  • LocationChicago area

Posted 17 July 2012 - 03:12 AM

Wanted to see if anyone could post a snippet of CSS that I can use to change the radius of the default SEARCH box in the header. Right now, it's set at, I believe, 13px. I need it to match the other boxes, down around 2 or 3 px. Spent the last couple of nights trying to figure this out - wanted to learn it..., but need to move on. Also searched in the forum and docs for an example or previous question's answer, but didn't see one (may have missed it...) I'm sure I'll understand it once i see it from you pros in the forum. Thank you in advance!

#2 batman

batman

    Bat Learning

  • Members

  • 2104 posts
  • LocationBuenos Aires, Argentina
  • Framework Version:DMS
  • Country: Country Flag

Posted 17 July 2012 - 04:10 AM

You can try add in
PageLines > Site Options > Custom Code > CSS Rules

 .searchform .searchfield{
			-webkit-border-radius: 3px;
			-moz-border-radius: 3px;
			border-radius: 3px;
		}

Change ..px as you like

#3 Danny

Danny

    Is Awesome!

  • Moderators
  • 16221 posts
  • LocationManchester, UK
  • Country: Country Flag

Posted 17 July 2012 - 12:57 PM

Hi @andrewstein, Did Batman's answer resolve your issue ?

#4 SteinVox

SteinVox

    Member

  • Members
  • 23 posts
  • LocationChicago area

Posted 18 July 2012 - 12:37 AM

Batman - this is beutiful. I was not close, but on the right path. Sometimes learning requires a shortcut. Thank you !! Danny - yes, this solution works! It would be great to have this as a settting in the layout editor along with the toggle (that exists) to turn off the search box entirely... The 13px radius doesn't match any of the docs..., and most of the other data input fields I'm using in other forms, also has a near zero radius. The default 13px radius is not style / design consistent. This snippet WORKS, so i''m good to go. I tried to ensure i asked the question in a way that it will be found by others with the same question - in 24 hours, I see it's been viewed 6 times (plus our two - makes 8) could be a winner for Batman ! Thank you !