Offset scroll anchor in HTML with Bootstrap 4 fixed navbar

There are a few different ways to solve it, but I think the best way is to put a hidden pseudo element ::before each section. This is a CSS only solution, no JS or jQuery… section:before { height: 54px; content: “”; display:block; } https://www.codeply.com/go/J7ryJWF5fr That will put the space needed to account for the fixed-top … Read more

Is there a reason why padding adds to the size of an element?

There are two different so-called “box models”, one adds the padding (and border) to the specified width, while the other does not. With the advent of CSS3, you can luckily switch between the two models. More precisely, the behaviour you are looking for can be achieved by specifying box-sizing: border-box; ms-box-sizing: border-box; webkit-box-sizing: border-box; moz-box-sizing: … Read more

Need to make a clickable button

There are two solutions posted on that page. The one with lower votes I would recommend if possible. If you are using HTML5 then it is perfectly valid to put a div inside of a. As long as the div doesn’t also contain some other specific elements like other link tags. <a href=”https://stackoverflow.com/questions/8660149/Music.html”> <div id=”music” … Read more

SASS Variable within string [duplicate]

Yes, you just have to use variable interpolation. Example: @mixin post-link ($class, $color, $hover) { a.#{$class}:link { color: $color; } a.#{$class}:hover { color: $hover; } } Example on SassMeister: http://sassmeister.com/gist/9533103 The key is adding #{ and } around your variable names to get them expanded.

Using a custom (ttf) font in CSS

You need to use the css-property font-face to declare your font. Have a look at this fancy site: http://www.font-face.com/ Example: @font-face { font-family: MyHelvetica; src: local(“Helvetica Neue Bold”), local(“HelveticaNeue-Bold”), url(MgOpenModernaBold.ttf); font-weight: bold; } See also: MDN @font-face

How-to create rounded corners on Table Head only

The problem is, that you need to make the certain inner elements round. So you have to make for the first th and the last th round to get the wished solution. table th:first-child{ border-radius:10px 0 0 10px; } table th:last-child{ border-radius:0 10px 10px 0; }

resize the content property’s image

I’ve run into the same problem before. Try this: #geog:before { display: inline-block; width: 16px; height: 16px; margin-right: 5px; content: “”; background: url(“icons/geogebra.ico”) no-repeat 0 0; background-size: 100%; } I’m sure you’ll have to tweak those values, but that worked for me. Of course, this won’t work if you can’t set it as a background … Read more

Hata!: SQLSTATE[HY000] [1045] Access denied for user 'divattrend_liink'@'localhost' (using password: YES)