The solution was for the message “We use cookies to enhance your experience in our web site. By visiting it, you agree our Cookies Policy.” It is important that the panel does not reappear after closing/accepting the agreement. Here is the HTML, CSS, JS code to implement the panel on …
Read More »
A very elegant solution, with which the image will not be wrapped in <a href=””></a>, image will float on click to the center of the screen and will be able to close both on the top cross and on a click on a translucent background. Image code: <div class="image__wrapper"> <img …
Read More »
This case is used for landing pages, for pages with a lot of content. The default anchor link looks like this: <p><a href="#mylink">Anchor link </a></p> <div id="mylink"></div> Sometimes, instead of <div id=”mylink”></div> this code <a name=”mylink”></a> is used, the result will be the same, but w3c validators will complain about …
Read More »
I used the most popular query for my practice in the post title, but there are more options in the table below. Options for :nth-child 1 1 The first element, is a synonym for the :first-child pseudo-class 5 5 5th element 2n 2, 4, 6, 8, 10 All even elements, …
Read More »
Few examples for showing a block on button click. Example 1: easy to use <script type="text/javascript"> function openlink(id){ display = document.getElementById(id).style.display; if(display=='none'){ document.getElementById(id).style.display='block'; }else{ document.getElementById(id).style.display='none'; } } </script> The block will be opened by clicking on the link: <a href="#" onclick="openlink('mylink'); return false">Open the link</a> Content will be shown when …
Read More »
If your icons, for example <i class=”fa fa-arrow-right”></i> are not displayed on your site, you need to try in the <head> section add this line: <link href="https://maxcdn.bootstrapcdn.com/font-awesome/4.2.0/css/font-awesome.min.css" rel="stylesheet" media="screen" /> Important! Be sure to use https instead of http. If it doesn’t solve the problem, then add this property to …
Read More »
You need to use the transform property and set it to scale(1.1) to increase it and scale(0.9) to decrease it. When hovering over an image/button/link with the class button, it will increase by 10% or decrease by 10%. Increase image/button/link – CSS: .button:hover { -webkit-transform: scale(1.1); -ms-transform: scale(1.1); transform: scale(1.1); …
Read More »
This article describes two options for decorating text with a border around the text along the path of the same text. There are, of course, more of these options. But I usually use the ones listed below. Example 1, crappy: using the text-shadow property text-shadow: 1px 0 0 red, -1px …
Read More »
Very often I need to replace a narrow widget, which for some reason is assigned to VKontakte with a fixed width of 300px, with a percentage, for example 100% – in order to be displayed on the entire width of the side column. The solution is simple, make changes to …
Read More »
If you need to create a separate css file and use it for your website, copy this code and insert in the head section this one: <link rel="stylesheet" type="text/css" href="newfile.css">
Read More »
WEBinP Your guide to resolving CMS optimization, Web Development and SEO problems