Css Snippets » safari

Vergroten textarea in Safari uitzetten

Mark — Wed, 13 Jan 2010 07:00:05 +0000

Standaard krijg je in Safari browsers de mogelijkheid om textarea te vergroten of verkleinen – re-size. Dit kan je via CSS uitzetten:

Aangeraden is deze snippet in een Safari only hack te zetten

CSS

@media all and (-webkit-min-device-pixel-ratio:0) {
textarea { resize:none; }
}

Google Bookmarks Digg BlinkList Technorati Twitter del.icio.us Facebook StumbleUpon

Border-radius: maak ronde hoeken met CSS

Mark — Thu, 15 Oct 2009 07:30:57 +0000

Met de komst van CSS3 is het mogelijk via CSS ronde hoeken te bepalen voor elementen, momenteel hebben enkel FireFox/Mozilla en Safari 3 deze optie geïntrigeerd.
Andere browsers zullen het dus voorlopig nog zonder moeten doen, maar hoe gebruik je nu border-radius?

CSS3 (nog niet klaar!!)

CSS

#foo {
border-top-right-radius: 10px;
border-bottom-right-radius: 5px;
border-bottom-left-radius: 5px;
border-top-left-radius: 10px;
}
#foo {
border-radius: 5px; /*alle hoeken hetzelfde*/
}

Safari/webkit

CSS

#faa {
webkit-border-top-right-radius: 10px;
webkit-border-bottom-right-radius: 5px;
webkit-border-bottom-left-radius: 5px;
webkit-border-top-left-radius: 10px;
}
#faa {
webkit-border-radius: 5px; /*alle hoeken hetzelfde*/
}

FireFox/Mozilla

CSS

#fee {
moz-border-radius-topright: 10px;
moz-border-radius-bottomright: 5px;
moz-border-radius-bottomleft: 5px;
moz-border-radius-topleft: 10px;
}
#fee {
moz-border-radius: 5px; /*alle hoeken hetzelfde*/
}

Google Bookmarks Digg BlinkList Technorati Twitter del.icio.us Facebook StumbleUpon

CSS hack voor Chrome en Safari

Mark — Thu, 28 May 2009 06:19:04 +0000

Hacken voor Google Chrome of voor Apple Safari, normaal gezien niet echt nodig. Deze browsers houden zich aan de regels, maar ooit heb je het misschien nodig en dan moet je weten hoe natuurlijk. Volgende hack werkt dus enkel in Chrome en Safari.

CSS

/*\*/
html>body*.yourclass {
padding:6px;
font-size:13px;
}
/**/

Google Bookmarks Digg BlinkList Technorati Twitter del.icio.us Facebook StumbleUpon

Verwijder Mac Safari Glowing Blue Outline op input

Mark — Fri, 08 May 2009 08:28:24 +0000

Als je een mac lover bent (of safari op windows gebruikt) zal je ongetwijfelt al gemerkt hebben als met Safari een formulier invult, deze een “glowing blue outline” zet op het formulierveld waar je op dat moment iets wilt invullen.

Input veld zonder focus in Safari

Input veld met focus in Safari

Als je als ontwerper van een formulier dit niet wenst, kan je volgende CSS toepassen.

CSS

input:focus { outline: none; }

Google Bookmarks Digg BlinkList Technorati Twitter del.icio.us Facebook StumbleUpon