MarcosFM

Thanks for your help, Ingolme!

Thanks, Ingolme! Where could I find the device-independent pixels of different devices?

Hi! I've been reading about media queries in www.w3schools.com and then thinking about the screen sizes of mobile phones, tablets, laptops and desktops.

As you can see in webpages like http://screensiz.es/ the width of a Huawei Nexus 6p (mobile phone) is 1440px, while the width of a Lenovo Thinkpad X230 (laptop) is 1366px. This means that the number of pixels of a screen doesn't tell us its real size and, therefore, I don't think it makes sense to create media queries in px, like the following example from www.w3schools.com:

@media only screen and (max-width: 768px) {
    /* For mobile phones: */
    [class*="col-"] {
        width: 100%;
    }
}

I think it would be better to write the above media query as follows (I think 14 cm is the maximum width you can find in mobile phone screens today):

@media only screen and (max-width: 14cm) {
    /* For mobile phones: */
    [class*="col-"] {
        width: 100%;
    }
} 

Maybe I'm making a mistake, I don't know...

Could anybody help? Thank you, Marcos.

Good idea. Thank you, dsonesuk!

Hi! I've been learning HTML with w3schools and I really like it! Is there a version of w3schools in pdf format? Thank you! 

Thanks for your quick answers! Following dsonesuk advice, I have removed the tags <style> and </style> from my .css file and everything works now.  

Hi! I am reading the HTML5 tutorial from www.w3schools.com. All the examples I've tried have worked well, but not the following one: I want to change the link colours of one of my pages. The "visited", "active" and "hover" are working, but not "link", I don't know why. Could anyone help? This is what I have put in a .css file:

<style>

a:link {
    color: black; 
    background-color: transparent; 
    text-decoration: none;
}

a:visited {
    color: red;
    background-color: transparent;
    text-decoration: none;
}

a:hover {
    color: green;
    background-color: transparent;
    text-decoration: underline;
}

a:active {
    color: yellow;
    background-color: transparent;
    text-decoration: underline;
}

</style>

Thanks!