Cross browser CSS rules [duplicate]2019 Community Moderator ElectionHow to detect Safari, Chrome, IE, Firefox and Opera browser?How to align checkboxes and their labels consistently cross-browsersSet cellpadding and cellspacing in CSS?How to vertically center a div for all browsers?Is there a CSS parent selector?How to make a div 100% height of the browser window?Change an HTML5 input's placeholder color with CSSGet the size of the screen, current web page and browser windowHow can I transition height: 0; to height: auto; using CSS?How do CSS triangles work?Is it possible to apply CSS to half of a character?
Align equations with text before one of them
Problems with rounding giving too many digits
Should we avoid writing fiction about historical events without extensive research?
The past tense for the quoting particle って
PTiJ: How should animals pray?
Has a sovereign Communist government ever run, and conceded loss, on a fair election?
Create chunks from an array
Can you run a ground wire from stove directly to ground pole in the ground
Why do phishing e-mails use faked e-mail addresses instead of the real one?
Is there a way to find out the age of climbing ropes?
Integrating function with /; in its definition
Naming Characters after Friends/Family
Called into a meeting and told we are being made redundant (laid off) and "not to share outside". Can I tell my partner?
Why do we call complex numbers “numbers” but we don’t consider 2 vectors numbers?
How spaceships determine each other's mass in space?
Ultrafilters as a double dual
What is the purpose of a disclaimer like "this is not legal advice"?
Quitting employee has privileged access to critical information
Replacing tantalum capacitor with ceramic capacitor for Op Amps
What does it mean when I add a new variable to my linear model and the R^2 stays the same?
What does "rhumatis" mean?
What is "desert glass" and what does it do to the PCs?
An Undercover Army
Convert an array of objects to array of the objects' values
Cross browser CSS rules [duplicate]
2019 Community Moderator ElectionHow to detect Safari, Chrome, IE, Firefox and Opera browser?How to align checkboxes and their labels consistently cross-browsersSet cellpadding and cellspacing in CSS?How to vertically center a div for all browsers?Is there a CSS parent selector?How to make a div 100% height of the browser window?Change an HTML5 input's placeholder color with CSSGet the size of the screen, current web page and browser windowHow can I transition height: 0; to height: auto; using CSS?How do CSS triangles work?Is it possible to apply CSS to half of a character?
This question already has an answer here:
How to detect Safari, Chrome, IE, Firefox and Opera browser?
19 answers
Using one style sheet I want to achieve kind of cross platform rules.
I will show you quite easy example to explain exactly what I want.
I have two div elements like that:
<div class="outer">
<div class="inner">
</div>
</div>
And some simple styles to them:
div.outer
background-color: red;
width: 200px;
height: 200px;
div.inner
height: 100px;
width: 100px;
background-color: blue;
Now I want to override background color of one of them, for example inner, with the other color based on the browser I'm using. For example if I open this by Chrome I want this color to be green, and when I open it with IE I want it to be blue.
I have an idea how to do this (instead of other style sheets for each browser), but it doesn't work this way:
@media screen
.chrome .inner
background-color: green !important;
Do you know how to do that guys?
css html5 css3 cross-browser
asked yesterday
MystaxMystax
53
marked as duplicate by Alohci css
Users with the css badge can single-handedly close css questions as duplicates and reopen them as needed.
StackExchange.ready(function()
if (StackExchange.options.isMobile) return;
$('.dupe-hammer-message-hover:not(.hover-bound)').each(function()
var $hover = $(this).addClass('hover-bound'),
$msg = $hover.siblings('.dupe-hammer-message');
$hover.hover(
function()
$hover.showInfoMessage('',
messageElement: $msg.clone().show(),
transient: false,
position: my: 'bottom left', at: 'top center', offsetTop: -7 ,
dismissable: false,
relativeToBody: true
);
,
function()
StackExchange.helpers.removeMessages();
);
);
);
yesterday
This question has been asked before and already has an answer. If those answers do not fully address your question, please ask a new question.
add a comment |
This question already has an answer here:
How to detect Safari, Chrome, IE, Firefox and Opera browser?
19 answers
Using one style sheet I want to achieve kind of cross platform rules.
I will show you quite easy example to explain exactly what I want.
I have two div elements like that:
<div class="outer">
<div class="inner">
</div>
</div>
And some simple styles to them:
div.outer
background-color: red;
width: 200px;
height: 200px;
div.inner
height: 100px;
width: 100px;
background-color: blue;
Now I want to override background color of one of them, for example inner, with the other color based on the browser I'm using. For example if I open this by Chrome I want this color to be green, and when I open it with IE I want it to be blue.
I have an idea how to do this (instead of other style sheets for each browser), but it doesn't work this way:
@media screen
.chrome .inner
background-color: green !important;
Do you know how to do that guys?
css html5 css3 cross-browser
asked yesterday
MystaxMystax
53
marked as duplicate by Alohci css
Users with the css badge can single-handedly close css questions as duplicates and reopen them as needed.
StackExchange.ready(function()
if (StackExchange.options.isMobile) return;
$('.dupe-hammer-message-hover:not(.hover-bound)').each(function()
var $hover = $(this).addClass('hover-bound'),
$msg = $hover.siblings('.dupe-hammer-message');
$hover.hover(
function()
$hover.showInfoMessage('',
messageElement: $msg.clone().show(),
transient: false,
position: my: 'bottom left', at: 'top center', offsetTop: -7 ,
dismissable: false,
relativeToBody: true
);
,
function()
StackExchange.helpers.removeMessages();
);
);
);
yesterday
This question has been asked before and already has an answer. If those answers do not fully address your question, please ask a new question.
add a comment |
This question already has an answer here:
How to detect Safari, Chrome, IE, Firefox and Opera browser?
19 answers
Using one style sheet I want to achieve kind of cross platform rules.
I will show you quite easy example to explain exactly what I want.
I have two div elements like that:
<div class="outer">
<div class="inner">
</div>
</div>
And some simple styles to them:
div.outer
background-color: red;
width: 200px;
height: 200px;
div.inner
height: 100px;
width: 100px;
background-color: blue;
Now I want to override background color of one of them, for example inner, with the other color based on the browser I'm using. For example if I open this by Chrome I want this color to be green, and when I open it with IE I want it to be blue.
I have an idea how to do this (instead of other style sheets for each browser), but it doesn't work this way:
@media screen
.chrome .inner
background-color: green !important;
Do you know how to do that guys?
css html5 css3 cross-browser
asked yesterday
MystaxMystax
53
This question already has an answer here:
How to detect Safari, Chrome, IE, Firefox and Opera browser?
19 answers
Using one style sheet I want to achieve kind of cross platform rules.
I will show you quite easy example to explain exactly what I want.
I have two div elements like that:
<div class="outer">
<div class="inner">
</div>
</div>
And some simple styles to them:
div.outer
background-color: red;
width: 200px;
height: 200px;
div.inner
height: 100px;
width: 100px;
background-color: blue;
Now I want to override background color of one of them, for example inner, with the other color based on the browser I'm using. For example if I open this by Chrome I want this color to be green, and when I open it with IE I want it to be blue.
I have an idea how to do this (instead of other style sheets for each browser), but it doesn't work this way:
@media screen
.chrome .inner
background-color: green !important;
Do you know how to do that guys?
This question already has an answer here:
How to detect Safari, Chrome, IE, Firefox and Opera browser?
19 answers
css html5 css3 cross-browser
css html5 css3 cross-browser
asked yesterday
MystaxMystax
53
asked yesterday
MystaxMystax
53
asked yesterday
MystaxMystax
53
asked yesterday
MystaxMystax
53
asked yesterday
MystaxMystax
53
53
marked as duplicate by Alohci css
Users with the css badge can single-handedly close css questions as duplicates and reopen them as needed.
StackExchange.ready(function()
if (StackExchange.options.isMobile) return;
$('.dupe-hammer-message-hover:not(.hover-bound)').each(function()
var $hover = $(this).addClass('hover-bound'),
$msg = $hover.siblings('.dupe-hammer-message');
$hover.hover(
function()
$hover.showInfoMessage('',
messageElement: $msg.clone().show(),
transient: false,
position: my: 'bottom left', at: 'top center', offsetTop: -7 ,
dismissable: false,
relativeToBody: true
);
,
function()
StackExchange.helpers.removeMessages();
);
);
);
yesterday
This question has been asked before and already has an answer. If those answers do not fully address your question, please ask a new question.
marked as duplicate by Alohci css
Users with the css badge can single-handedly close css questions as duplicates and reopen them as needed.
StackExchange.ready(function()
if (StackExchange.options.isMobile) return;
$('.dupe-hammer-message-hover:not(.hover-bound)').each(function()
var $hover = $(this).addClass('hover-bound'),
$msg = $hover.siblings('.dupe-hammer-message');
$hover.hover(
function()
$hover.showInfoMessage('',
messageElement: $msg.clone().show(),
transient: false,
position: my: 'bottom left', at: 'top center', offsetTop: -7 ,
dismissable: false,
relativeToBody: true
);
,
function()
StackExchange.helpers.removeMessages();
);
);
);
yesterday
This question has been asked before and already has an answer. If those answers do not fully address your question, please ask a new question.
add a comment |
add a comment |
2 Answers
2
active
oldest
votes
check this
it will give you complete cross browser identification
when you get browser info then just custom you style
Hope it will help you Happy coding!
answered yesterday
Rai Talha RehmanRai Talha Rehman
5011
It's brilliant in its simplicity, thanks a lot.
– Mystax
yesterday
add a comment |
There are ways to achieve certain effects like this only with CSS & HTML, but this will only target some of the major browsers.. I wouldn't recommend it.
Here's an example:
/* style for all browsers (think Google & Safari/Webkit): */
p
background-color: blue;
/* overrule for Firefox: */
@-moz-document url-prefix()
p
background-color: gold;
And then in your HTML for IE:
<!--[if IE]>
<style>
p
background-color: purple;
</style>
<![endif]-->
answered yesterday
SvenSven
407514
1
Unfortunately I can mark only one answer as a solution and Rai was better for me, but thank you for help.
– Mystax
yesterday
That's alright! I hope it helps others in the future looking for pure CSS solutions.
– Sven
yesterday
add a comment |
2 Answers
2
active
oldest
votes
2 Answers
2
active
oldest
votes
active
oldest
votes
active
oldest
votes
check this
it will give you complete cross browser identification
when you get browser info then just custom you style
Hope it will help you Happy coding!
answered yesterday
Rai Talha RehmanRai Talha Rehman
5011
It's brilliant in its simplicity, thanks a lot.
– Mystax
yesterday
add a comment |
check this
it will give you complete cross browser identification
when you get browser info then just custom you style
Hope it will help you Happy coding!
answered yesterday
Rai Talha RehmanRai Talha Rehman
5011
It's brilliant in its simplicity, thanks a lot.
– Mystax
yesterday
add a comment |
check this
it will give you complete cross browser identification
when you get browser info then just custom you style
Hope it will help you Happy coding!
answered yesterday
Rai Talha RehmanRai Talha Rehman
5011
check this
it will give you complete cross browser identification
when you get browser info then just custom you style
Hope it will help you Happy coding!
answered yesterday
Rai Talha RehmanRai Talha Rehman
5011
answered yesterday
Rai Talha RehmanRai Talha Rehman
5011
answered yesterday
Rai Talha RehmanRai Talha Rehman
5011
answered yesterday
Rai Talha RehmanRai Talha Rehman
5011
5011
It's brilliant in its simplicity, thanks a lot.
– Mystax
yesterday
add a comment |
It's brilliant in its simplicity, thanks a lot.
– Mystax
yesterday
It's brilliant in its simplicity, thanks a lot.
– Mystax
yesterday
It's brilliant in its simplicity, thanks a lot.
– Mystax
yesterday
add a comment |
There are ways to achieve certain effects like this only with CSS & HTML, but this will only target some of the major browsers.. I wouldn't recommend it.
Here's an example:
/* style for all browsers (think Google & Safari/Webkit): */
p
background-color: blue;
/* overrule for Firefox: */
@-moz-document url-prefix()
p
background-color: gold;
And then in your HTML for IE:
<!--[if IE]>
<style>
p
background-color: purple;
</style>
<![endif]-->
answered yesterday
SvenSven
407514
1
Unfortunately I can mark only one answer as a solution and Rai was better for me, but thank you for help.
– Mystax
yesterday
That's alright! I hope it helps others in the future looking for pure CSS solutions.
– Sven
yesterday
add a comment |
There are ways to achieve certain effects like this only with CSS & HTML, but this will only target some of the major browsers.. I wouldn't recommend it.
Here's an example:
/* style for all browsers (think Google & Safari/Webkit): */
p
background-color: blue;
/* overrule for Firefox: */
@-moz-document url-prefix()
p
background-color: gold;
And then in your HTML for IE:
<!--[if IE]>
<style>
p
background-color: purple;
</style>
<![endif]-->
answered yesterday
SvenSven
407514
1
Unfortunately I can mark only one answer as a solution and Rai was better for me, but thank you for help.
– Mystax
yesterday
That's alright! I hope it helps others in the future looking for pure CSS solutions.
– Sven
yesterday
add a comment |
There are ways to achieve certain effects like this only with CSS & HTML, but this will only target some of the major browsers.. I wouldn't recommend it.
Here's an example:
/* style for all browsers (think Google & Safari/Webkit): */
p
background-color: blue;
/* overrule for Firefox: */
@-moz-document url-prefix()
p
background-color: gold;
And then in your HTML for IE:
<!--[if IE]>
<style>
p
background-color: purple;
</style>
<![endif]-->
answered yesterday
SvenSven
407514
There are ways to achieve certain effects like this only with CSS & HTML, but this will only target some of the major browsers.. I wouldn't recommend it.
Here's an example:
/* style for all browsers (think Google & Safari/Webkit): */
p
background-color: blue;
/* overrule for Firefox: */
@-moz-document url-prefix()
p
background-color: gold;
And then in your HTML for IE:
<!--[if IE]>
<style>
p
background-color: purple;
</style>
<![endif]-->
answered yesterday
SvenSven
407514
edited yesterday
answered yesterday
SvenSven
407514
answered yesterday
SvenSven
407514
answered yesterday
SvenSven
407514
407514
1
Unfortunately I can mark only one answer as a solution and Rai was better for me, but thank you for help.
– Mystax
yesterday
That's alright! I hope it helps others in the future looking for pure CSS solutions.
– Sven
yesterday
add a comment |
1
Unfortunately I can mark only one answer as a solution and Rai was better for me, but thank you for help.
– Mystax
yesterday
That's alright! I hope it helps others in the future looking for pure CSS solutions.
– Sven
yesterday
1
1
Unfortunately I can mark only one answer as a solution and Rai was better for me, but thank you for help.
– Mystax
yesterday
Unfortunately I can mark only one answer as a solution and Rai was better for me, but thank you for help.
– Mystax
yesterday
That's alright! I hope it helps others in the future looking for pure CSS solutions.
– Sven
yesterday
That's alright! I hope it helps others in the future looking for pure CSS solutions.
– Sven
yesterday
add a comment |
