Grey bar on top of page onYouTube ios safari.

Question

Ok, so suddenly I have a big ugly grey bar on top of the page when I try to look at youtube on safari on the ipad.
The grey bar is displaying the YouTube app icon, with a button to open the app ( because I have the app installed, I imagine it would say install if I didn't.)
Now if I wanted to use the app, guess what, I would. I prefer to look at youtube on my browser.
The problem is that on the grey bar at the top left corner is a tiny (X) button to dismiss the grey bar, which I would very much like to do, but it is impossible because I cannot press the (X) because it is positioned in such a way that its like there is no button there. I tried repeatedly to close it, instead, it just keeps opening the YouTube app, which I don't want to do.
Is this bar going to remain on safari all the time when I want to look at youtube?
I don't understand why I'm being pushed to use the app. I know I have it, I don't need reminding, I'm choosing not to use it, i prefer  safari version to app, why is safari doing this?
I feel like Apple is trying its hardest to annoy everyone and ruin what was a slick seamless service before Steve jobs left the game.
There are several other little annoyances like this that I can't even be bothered to get into, all beginning immediately after Steve was out of the picture.
Meanwhile, chrome browser for ios is displaying everything beautifully and is becoming my main browser on ipad.
Are they trying to push me toward the Google phones and tablets, because it's working.
Does anyone know how to dismiss this irritating grey bar?

Answer 1

Martijnke wrote:
Hi all,
I am having trouble getting some things done by changing the html/css
we use apex 4.1 and sapphire theme 17
all I want to do is to decrease the size of the bar on top of the page and get rid of the ugly border at the bottom of it
this is code you find on page 0 , region  
<STYLE type="text/css">
#topbar {
border-bottom: 0px;
#header {
height: 15px;
</STYLE>getting rid of the bottom border ok
however as soon as I make #header smaller than 50px, the whiole layout gets messed upThe layout is behaving exactly as requested. What you're seeing is not the "layout getting messed up", it's the background image with a fixed-size "header" applied to the page <tt>body</tt>, visible through transparent elements that are now in positions not anticipated by the designer of the theme.
You need to shift the page background up with respect to the viewport to allow for the 35px difference in <tt>header</tt> height between the theme's 50px and your 15px:
body {
  background-position: 50% -35px;
}Note that this introduces a subtle change in the header as the gradient fill now appears to start with a darker shade.