Whole website in grayscale except some div not working

I have a page with popup displayed onload. The whole site is in greyscale but I want to popup div to be in non-greyscale. I have tried with filter: none or -webkit-filter: grayscale(0); but it is not working that the whole page is in greyscale. Does anyone have any idea on it? Thanks!-webkit-filter: grayscale(0) !important;filter: grayscale(0) !important;My code: Jsfiddle -webkit-filter isn't a property that cascades down and can be overwritten, it's applied on top of the whole element and its children. If you put a filter on the children, it stacks on top of the parent'...

CSS background video sizing issue with large videos

I'm having problems resizing to keep the aspect ratio with large videos. I'm using this demo code: https://codeconvey.com/fullscreen-html5-responsive-video-background/My problem is that I can get centering the video to work correctly, and the video resizes keeping the aspect ratio if the window is larger than the video, but a 1920x1080 video is not resizing down to fit the height or width of the browser on smaller screens (say, a laptop at 1440px wide). It seems that the video never scales down from it's original size.It's as if the body doesn't understand that the viewport...

HTML CSS Buttons Hover Wont Work Through Class

I don't understand why does this work :.button:active { position:relative; top: 2px; left:2px;}But this wont work :.button:hover { font-size:17px;}It works when I use id but I want it to activate for all buttons :#btnhome:hover{ font-size:17px;}This works fine but with class it wont? What am I doing wrong? Using id and it works so sure something has to do with the specificity, over riding, try thisDemoDemo + !important.button:hover { font-size:17px !important; /* Actually you don't even need !important */} [XXX]Try: .button *:hover { font-size:1...

When adding a tag in an HTML section, adds blank line above header

Any tag (p>, div>, h3>) inserted as a first tag inside section> #firstentry adds empty line above header. Checked all CSS, no it's HTML. If I remove div> (marked with **** in the code sample) the empty line disappears. Same if I use any other tags, except b>, and same with other pages. I think I'm doing something wrong in the #firstentry section. <!DOCTYPE html><html> <head> <meta charset="utf-8"> <title>Anna Putane | Designer</title> <link rel="stylesheet" href="css/normalize.css"> </head> <body> &l...

ngForm or plain HTML Form - variable length inputs using *ngFor

I am trying to do a variable length input form for ticket sales at which point I want to build that many input forms for a name and a gender for the guest, but I cannot think of how to do the id which must be unique using this method. I am currently trying to use this and getting mad errors: Unhandled Promise rejection: Template parse errors: Parser Error: Unexpected token = at column 24 in [let guest of guests; i = index] in SellTicketComponent@315:22 ("" #f="ngForm"> --> ]*ngFor="let guest of guests; i = index"> ...

How to set all buttons in a controlgroup to the same height when some have two-row labels?

I want to create a row of multiple buttons to form a coherent block in jQuery Mobile. For this, I placed them in a horizontal controlgroup. This approach works well for simple labels, but now I want to have one or more buttons with two rows of text on them. For example:<form><fieldset data-role="controlgroup" data-type="horizontal"> <a href="#" data-role="button" data-icon="minus" data-iconpos="left">Left</a> <a href="#" data-role="button">Middle item<br/><sub>Second row</sub></a> <a href="#" data-role="button" d...

iTextSharp HTML to PDF conversion - unable to change font

I'm creating some PDF documents with iTextSharp (5.5.7.0) from HTML in ASP.NET MVC5 application, but I'm unable to change the font. I've tried almost everything that I was able to find on SO or from some other resources.Code for PDF generation is as follows: public Byte[] GetRecordsPdf(RecordsViewModel model) { var viewPath = "~/Template/RecordTemplate.cshtml"; var renderedReport = RenderViewToString(viewPath, model); FontFactory.RegisterDirectory(Environment.GetFolderPath(Environment.SpecialFolder.Fonts)); using (var ms = new MemoryStream(...

How do I change the font color in an html table?

How do I change the font color in an html table?<table><tbody><tr><td><select name="test"><option value="Basic">Basic : $30.00 USD - yearly</option><option value="Sustaining">Sustaining : $60.00 USD - yearly</option><option value="Supporting">Supporting : $120.00 USD - yearly</option></select></td></tr></tbody></table>I have tried<span style="color: #0000ff;"> </span> in multiple locations ... which doesn't work. <table><tbody><tr><td><se...

CSS - Trying to apply styling to a class within a class within a modal popup

EDIT:I have still not found a solution however i have managed to avoid the issue entirely. If someone know why this doesn't work it would be incredibly helpful so i know for the future. Thank you-I can't seem to get this to work and i've tried searching everywhere for an answer.This is the gist of it (all nested within a modalPopup Panel.<div class="body"> <div> <div class="left"> <asp:Label runat="server" Text="Name:" /> </div> <div class="right"> <asp:TextBox runat="server" ID="txtName" Text=...

How to make a newline inside the html tag <a> with CSS?

I would like to know how to make a newline inside the html tag with CSS. The explanation is as below:This is the code HTML that I have:<ul class="dropdown-menu pull-right" id="mess_menu" role="menu"><li style="border-bottom: 1px #D3D3D3;border-bottom-style: solid;"><span style="display:block; width: 200px">The numbers in the table specify the first browser version that fully supports the property.The numbers in the table specify the first browser version that fully supports the property.</span></li></ul>This is the code CSS (it belongs t...

Video.js - Autoplay and Loop not working on phone

I use this code to make a video (eg. banner, so no controls) autoplay and loop forever.<video id="video1" class="video-js vjs-default-skin" controls width="900" height="500" poster="myposter.jpg" data-setup='{ "controls": false, "loop": "true", "autoplay": true, "preload": "true"}'> <source src="thisismyvideoyay.webm" type='video/webm' /> </video>It works fine on my computer but on my phone (Android OS 4.2.2 with Chrome) it's not autoplaying or preloading and not looping after it finished.I read this o...

Changing the colour of a button

I'm having problems in order to change the colour of this button. This is the code:<div class = "Petrol"> <a href="PayMethod.php"><button class="btn btn-default btn-lg" type="button"><span class="Text">Petrol<br><small>(Hi-Grade)</small></span></button> </a></div>Can you please help me? Assuming by the classes you used, I think you are using Bootstrap. Bootstrap provide pre-defined classes to change bg color of buttons. Replace btn-default by any of the following to get a different color. btn-primary, ...

how to change the color of part of the h2 heading in html

I have a h2 heading that says "WHO WE ARE". I need the word "WHO" to stay white and "WE ARE" to be red.I can't figure out how to do this.Please help You normally have to (HTML)tag the part of the text you want to change the color of. And then use CSS to change the color. For example:h2 {color:red;}h2 .colorTwo {color:blue;}<h2><span class="colorTwo">WHO</span> WE ARE</h2> [XXX]

Abstracting static HTML to React

So I've been working on trying to abstract a current HTML page I have into React. I'm not sure why, but its proven to give me a good amount of trouble. Would anyone be able to help me get on the right track? Here is an example of the code I am trying to abstract into a component.<nav className="navbar navbar-inverse"> <div className="container-fluid"> <span className="navbar-brand navbar-header">name</span> <ul className="nav navbar-nav"> </ul> <div classNam...

HTML: Scalable Text

Hello I am making a website and i feel it is quite important that the text on the page is scalable for if the user has a smaller monitor or is using split screen.I have the following HTML coding, that I believed would make it scale effectively but nothing happens?HTML: <p id="text"> View <a id="advertlinks" href="Prices.html">Prices</a> </br>Or <br><a id="advertlinks" href="Contact_Us.html">Book</a> A Lesson </p>CSS#text{z-index:100;position:absolute; margin-top:-22%;margin-left: 70%;padding: 2%;wid...

css font-size is smaller in apple mail than gmail (iphone)

I'm doing an html newsletter and the font size result is really different between apple mail and gmail (both on iphone). Apple mail has a really small letter but if I increase it in gmail it looks huge. How can I solve this? thanks! This should help you, write any other tags which you use in your mail.<style type="text/css"> div, p, a, li, td { -webkit-text-size-adjust:none; }</style> [XXX]

Page 1 of 280  |  Show More Pages:  Top Prev Next Last