how to fix scrollbar bar jumping page in firefox

i was found one issue in Firefox, there is some issue in website, that while viewing in Firefox its jumping / moving that page. so i was observing and checking that issue, it was not at all any kind of issue, its just scroll bar visible and disable, means which time page loads time there is no scroll bar so page is center aligned its seems perfect with that, but after hole page load, there is scroll bar added in the page, so its slightly moves to adjust same as center align.

so being some tricky just use of below CSS 3.0

html { overflow-y: scroll; }

which is technically very true to use it, it will not effect to IE6, due to its CSS 3.0 attribute, so IE6 will be ignoring that CSS attribute.

another way

html { overflow: -moz-scrollbars-verticals}

Firefox will be showing scrollbar from the start. it will stop jumping your page

Adobe extends Flash to TVs, Blu-ray players

NEW YORK (AP) — Adobe Systems Inc. is extending its Flash platform to digital home entertainment devices like TV sets, Blu-ray players and set-top boxes.

Adobe announced Monday that the move will let people watch high-definition videos, play Flash-based games and access other Web content on their Internet-connected TV sets.

Adobe says about 80 percent of all online videos run on the Flash platform. While it's been possible to watch online videos on TV sets, the company says it hasn't been "consistent." Some YouTube videos would work and some wouldn't, for example.

Adobe expects the first TVs and other devices that support the Flash platform to ship in the second half of this year.

Chrome Hack

its just very simple as different browsers hacking, actually chrome browser is using safari API, so all kind of safari hack will work in chrome hack.

example

.header { width:1000px;}

@media screen and (-webkit-min-device-pixel-ratio:0)
{.header{width:1003px;}}

soon i will updateing with more hacking and caring points for chrome browser.

css inline hack for IE6 & IE7

myself observer many programmer are facing problem browser compatibility issues in CMS systems or the HTML page is generating from any kind of database and its restricted to edit its style sheet.

in those kind of case i found few solutions, which is used in very rare case but very effective.

using . DOT

example

in this case . [dot] is used to hack for IE&7 & IE6

yes its true... you can separating hack IE7 and IE6,

.[dot] will follow the IE & IE6 browsers rules also in same manners \ will be works for IE7 & IE6.

Example for dot css

.header{ margin-top:10px; .margin-top:50px;}

example for slash

.header { width:100%; \width:99%; w\idth:80%;}

if you find any kind of problem contact me online on gtalk, devang[dot]solanki{at}gmail[dot]com

IE8 beta2 and CSS/ JavaScript compatibility quick fix

It’s very easy to solver IE8 beta 2 problem, just placing meta tag in header.

Example

< head >

html 4

<meta equiv="X-UA-Compatible" content="IE=EmulateIE7">

xhtml you have to modify this tag, it will look like below

<meta http-equiv="X-UA-Compatible" content="IE=EmulateIE7" / >

< / head >

Fixing the Firefox dotted link when is clicked

i was always founding problem in clicking in firefox, its always shows dotted line, even if i placed display:block, then its shows all area of clicking, for that i found one solutions, just place in a: tag outline:none; so on future you will not find dotted line when you click on link in firefox. the code is displayed blow.

.menu a:active { outline: none; }

also you can place it like below example

.menu a:active { outline: none; }

also you can define globally like example below

a { outline:none;}

hoping it will Fixing the Firefox dotted link when is clicked

CSS hack for Firefox only

Firefox 2.0 or older

If you need to make pre-Acid2 Firefox behave, you can safely use this:

#hackme, x:-moz-any-link {styles for Firefox 2.0 here}
#hackme, x:-moz-any-link, x:default {restore styles for Firefox 3.0 and newer}

This hack will apply rules to #hackme element. You can change the first selector (#hackme) in each rule to anything else, but don't touch the ones with x.

Example

For 9 versions support for inline-block in Gecko was FUBAR. The closest equivalent wouldn't respect line-height. The workaround:

#menu a {display:inline-block; line-height:2em;}
#menu a, x:-moz-any-link {display:-moz-inline-box; padding-top:0.5em;}
#menu a, x:-moz-any-link, x:default {display:inline-block; padding-top:0;}

Firefox 1.0 or older

#hackme, x:-moz-any-link {styles for Firefox 1.0 here}
#hackme, x:-moz-any-link, x:only-child {restore normal styles for newer versions}

Same as above — you can change #hackme to whatever you need, but leave other selectors in the same group as they are.

How do these work?

CSS error handling rules require browsers to drop entire rule if any of the selectors is not recognized. :-moz-any-link is a selector private to Gecko, so all non-Gecko browsers see it as parse error. :default has been added in Firefox 3.0 (Gecko 1.9), :only-child has been added in Firefox 1.5, so they're unknown to earlier versions of Firefox/Gecko.