CSS Linear-gradient

[michelscot]

Hallo :thumb:
Weet iemand hoe je een linear-gradient in Css kan maken voor Opera
In FF, IE ,Safari en Chroom is er geen probleem
Vb Link De bedoeling is dat er in de Tabs een gradient komt de Css die ik gebruik is

.TabbedPanelsTab {
	position: relative;
	top: 1px;
	float: left;
	padding: 4px 8px;
	margin: 0px 1px 0px 0px;
	font: bold 0.7em sans-serif;
	background:-moz-linear-gradient(18% 100% 90deg,#F5F4EB, #FCF9F5, #248BC7 100%);
	background-image: -webkit-gradient(linear,  0 0,0 100%, from(#248BC7), color-stop(40%, #FCF9F5), to(#F5F4EB));
	filter: progid:DXImageTransform.Microsoft.gradient(GradientType=0, startColorstr=#C0248BC7 , endColorstr=#00FFFFFF);
	list-style: none;
	border-left: solid 1px #006;
	border-bottom: solid 5px #FCF9F5;
	border-top: solid 1px #006;
	border-right: solid 1px #006;
	-moz-border-radius-topleft: 8px;
	-moz-border-radius-topright: 8px;
	-webkit-border-top-left-radius: 8px;
	-webkit-border-top-right-radius: 8px;
	border-radius: 8px 8px 0px 0px;
	cursor: pointer;
	outline:none; 
}
.TabbedPanelsTabHover {
	background:-moz-linear-gradient(100% 100% 90deg,#5598D4, #F7F6F5, #FAFAFA 100%);
	background-image: -webkit-gradient(linear, 0 0,0 100%, from(#F5F4EB), color-stop(40%, #FCF9F5), to(#5598D4));  
	filter: progid:DXImageTransform.Microsoft.gradient(GradientType=0, startColorstr=#00FFFFFF , endColorstr=#C0248BC7);
	border-bottom: 5px solid #FF9900;
	outline:none; 
}
.TabbedPanelsTabSelected {
	background:-moz-linear-gradient(100% 100% 90deg,#5598D4, #F7F6F5, #FAFAFA 100%);
	background-image: -webkit-gradient(linear,  0 0,0 100%, from(#F5F4EB), color-stop(40%, #FCF9F5), to(#5598D4));
	filter: progid:DXImageTransform.Microsoft.gradient(GradientType=0, startColorstr=#00FFFFFF , endColorstr=#C0248BC7);
	border-bottom: solid 5px #5598D4;
	outline:none; 
}

groetjes michelscot

 

[csshunter]

Hoi michelscot,
Er schijnt toegevoegd te moeten worden:

-o-linear-gradient(...)

Hier staat wat info over Opera en ondersteuning van css-gradiënten:

• www.css3.info/opera-barracuda-steps-up-css3-support/
• www.opera.com/docs/specs/presto28/#m28-119

Met vriendelijke groet,
CSShunter

 

[michelscot]

Hallo csshunter :thumb:

Heb het geprobeert maar het werkt niet ik bebruik opera 10.2
ik weet niet of het werkt in lagere versies van opera
toch bedankt voor je reactie

groetjes michelscot

 

[csshunter]

Hoi michelscot,
Uit de Opera-documentatie haal ik dat de nieuwe css3 gradiënt-eigenschappen (gedeeltelijk) zijn toegepast met ingang van de rendering-machine "Presto/2.8".
Op een andere pagina staat dat "Presto/2.8" alleen draait op de allernieuwste Opera Desktop 11.10 beta.

• Op die pagina ook aardige overzichtjes wat de verschillende Opera-versies al of niet aankunnen met de andere nieuwe css3-eigenschappen.

Dus de gradiënt zit nog niet op der laatste stabiele (niet-beta) versie 11.01 en alles wat daar vóór zit.
Waarmee het inderdaad klopt dat Opera 10.2 er nog niets van kan laten zien.
Wachten op de toekomst!

Met vriendelijke groet,
CSShunetr

 

[Naarling]

Hallo csshunter :thumb:

Heb het geprobeert maar het werkt niet ik bebruik opera 10.2
ik weet niet of het werkt in lagere versies van opera
toch bedankt voor je reactie

groetjes michelscot

Even afgezien van het feit dat die gradients pas vanaf ver. 11.1 werken moet je toch echt nodig eens upgraden, da's wel zo veilig.

 

[michelscot]

Hallo :thumb:

Heb intussen Opera 11.10 beta. geinstalleerd en de gradient werkt
bedankt voor jullie reacties

groetjes michelscot