In previous post: styling lists with pseudo-classes I described how to change the color of active, clicked or hovered links. Now I will show you how to change the style of selected links, e.g. only those that lead to PDF files.
Read More Styling chosen links on site, e.g only links to PDF fileAuthor: Joanna
Styling links with css
Standard appearance of hyperlinks on a website depends on the browser. Each browser can display links and their variants (with different pseudo-classes) in a different way.
Usually we want to set our own styles so to display links in the same way in any browser.
Links can have different states, and each of this states can be styled. This states are called pseudo-classes.
Read More Styling links with cssBasic git commands
You can perform git commands for example in:
– cmd console (widnows start -> cmd. It should oppened Command Prompt app. To go to the root directory, enter cd \ . Next enter cd + path to directory with your project, e.g. cd Users\ Joanna\Desktop\my-project
– git bash console, which you can get from https://git-scm.com/downloads . After installing console go to directory with your project, right click and select: Git Bash Here (then console opens).
If you have your console with path to your project, you can enter first command (step one).
Read More Basic git commandsRem, em – length units in CSS
I must admit that I rarely used such units of length as rem and em so far. I usually used pixels (px), because somehow it was easier for me to associate what size a given element will have.
The rem and em units, however, have one advantage over pixels – they can be set in correlation to parent font size (em) or root font size, which most often is <html> elemet (rem). This gives the ability to manipulate sizes for many elements at once. The default root font value is usually 16px (but it depends on the browser).
Read More Rem, em – length units in CSSResponsive images in HTML5, using srcset
Images often are problematic while we creating web page . Displaying larger image on larger screen is a better for user experience, but displaying large photo on small screen, e.g. on a phone, may unnecessarily delay page loading.
Therefore, a good solution is to “serve” images with different sizes and weight for different screens.
Read More Responsive images in HTML5, using srcsetAuto resize image to div size
Sometimes we want that picture on page shrinks when browser window shrins. This can be easily achieved by using a short css entry.
Read More Auto resize image to div sizeWhat is hoisting in javascript?
Every junior front-end developer should know what hoisting is. This issue can be easily understood, so if you have not heard of it before, you can quickly catch up:
Read More What is hoisting in javascript?How to set div to 100% window height?
Tworząc strony internetowe zdarza się, że chcemy, aby div z określonymi informacjami zajmował całą wysokość okna, niezależnie od wysokości tego okna. Wiadomo, że ustawiając wysokość dziecka na 100% zajmuje ono całą przestrzeń swojego rodzica. Zatem aby div zajmował całą wysokość okna, wszyscy jego rodzice muszą także mieć ustawioną taką wysokość.
When we create websites, we sometimes want to div takes 100% window height, depending on the height of the user’s browser window . It is known that by setting the child’s height to 100%, it takes the entire space of its parent. That’s why if we want to child div takes all window height, we must set all its parents to have 100% height.
Read More How to set div to 100% window height?How to center div horizontally and vertically in css
The problem of centering divs or text is quite common and I often had to spend more time fixing it than I would like. Sometimes the situation is simple and using one of the basic methods, like margin: 0 auto solves the case, and sometimes you have to think a little more. Therefore, below are some useful methods that you can use depending on your needs.
Read More How to center div horizontally and vertically in cssHow to check if string contains substring in javascript
Depending on what you currently want to achieve, you can use several solutions to check if the string contains substring:
Read More How to check if string contains substring in javascript