Modify a different tag within CSS

I am attempting to reduce the space between the words: "frihedskamp og fremtidsforelskelse"

When I remove the CSS tag in line 149, the spacing returns to normal. To address this, I tried adding the following override on line 266:

HTML

<div class="col-md-3 col-sm-6 col-xs-12">

    <article class="block-thumbnail">
        <a href="#" class="block-thumb">
            <div class="block-image">
                <div class="overlay"></div>
                <img src="/images/courses/au/designteori-og-historie/forelaesninger-slides/frihedskamp-og-fremtidsforelskelse.jpg" alt="Designteori">
            </div>
        </a>

        <div class="block-data">
            <h3>
                <a href="#">Frihedskamp Og Fremtidsforelskelse</a>
            </h3>
        </div>
    </article>

</div>

CSS

.block-thumbnail .block-data h3 a {
    font-size: 18px;
    font-weight: 900;
    color: #fff;
    line-height: 1.0
}

I initially thought adjusting the line-height would solve it, but that approach didn't work. Does anyone have suggestions on how I can achieve a "normal" line-height?

htmlcss

Answer №1

To start, remember to always include px after specifying the line height. Additionally, you can use !important following the line height declaration like this: line-height: 25px !important;

In my opinion, the default line-height is typically either 25px or 20px

Answer №2

Give it a shot

 .block-thumbnail .block-data h3 a { 
       font-size: 18px !important; 
    }

Similar questions

If you have not found the answer to your question or you are interested in this topic, then look at other similar questions below or use the search

Strategies for Concealing an Image When CSS is Active in Internet Explorer

My login functionality includes an input box with a CSS image that disappears onclick, allowing users to enter information. I used an image because the text password displays as "*", but this setup is not working in IE. Can anyone assist? HTML: <form ...

internet-explorerinputcss

Trigger the click event on the ul element instead of the li element using jQuery

Is there a way to make the click event only affect ul tags and not all li elements using jQuery? <!-- HTML --> <ul class="wrap"> <li>test1</li> <li>test2</li> <li>test3</li> </ul> I attemp ...

javascriptjqueryhtml

Can you provide me with the validation expression for the email format in ASP.NET?

Currently, I am working on validating a text field where users need to enter an email address following a specific format: [email protected] Here are the rules for the email validation: 1) The email address must end with .com. No numbers are allowed ...

c#htmlasp.netvisual-studiovalidation

Stop unwanted clicking on inactive buttons in Angular

I want to make sure that disabled buttons cannot be clicked by users who might try to remove the disabled attribute and trigger an action. Currently, I have this code to handle the situation: <button [disabled]="someCondition" (click)="executeAction()" ...

htmlangulartypescriptdom-events

Mastering the art of flawlessly executing kerning-generated code

I am facing a problem while implementing logotext with kerning technique in the <header> element. I found a useful tool made by Mr. Andrew which can be accessed through this link. Before making any modifications, I had the following code in the heade ...

phphtmlcsswordpresskerning

Maintaining a Multi-page template in PhoneGap: Best practices

I'm a beginner in Hybrid app development, currently using PhoneGap and Jquery Mobile. In my app, I have around 10 separate pages such as login.html, index.html, search.html, etc. My query is whether I should include all JS and CSS files on each indivi ...

jquerycsshtmlcordovajquery-mobile

Executing a single query in PHP using multiple WHILE loops

Recently, I've been working on a PHP page that interacts with an Oracle Database through SQL queries. SELECT * FROM TABLE1; My challenge now is to run five WHILE statements based on the value of the recordset. Ideally, it would look something like t ...

phpsqlhtml

Adjust the dimensions of a box by simultaneously altering both its height and width

I am looking to create a responsive box that automatically adjusts its height when the window width is resized. I have tried using Transform:Translate() to move the picture inside, but so far, the height only changes when I manually adjust the height of ...

htmlcss

Pseudo-element fails to display in React when applied to a paragraph tag, even with display block property set

I am experiencing an issue where the pseudo element ::after is not appearing in my browser. I am currently working with React.js and Material UI's makeStyles. Here is the code snippet causing the problem: modalTitle: { borderBottom: '2px sol ...

javascriptcssreactjsmaterial-uijsx

Tips for configuring a file using javascript and angular.js

I am in need of some assistance. I would like to create a configuration file that stores all the paths for JavaScript files, which can then be dynamically called and included in the index page using Angular.js or JavaScript. The structure of my files is ex ...

javascriptjqueryhtmlangularjs

The resizing and thumbnail feature is functioning properly, but there is an issue when uploading multiple files

My resize and thumbnail function seems to be working only with one file instead of multiple files. When attempting to upload more than one file, only the first file is processed correctly. It gets saved in the directory, resized, watermarked, and its path ...

phphtmlmysqldatabaseimage-uploading

Is there a way to delete a stylesheet if I only have limited information about the url?

I am attempting to dynamically remove a CSS stylesheet using JavaScript or jQuery. I am aware that the target stylesheet is located within the 'head' element and includes the text 'civicrm.css', however, I do not possess the full URL o ...

javascriptjquerycss

CSS: border-radius // background-color: white; rounded corners

Having recently delved into the world of HTML/CSS, I am currently working on a fun project to enhance my web development skills. In this project, I have created a search bar and successfully added round corners with border-radius. However, an issue arises ...

htmlcss

Cannot overflow a long flex div within parent div in CSS-Tailwind to achieve sliding effect

In the div with a class of scroll-content, I have a long list of images that I want to hide under a scroller div. My goal is to create a slide effect using arrow buttons. However, the flex box expands beyond 100% of the container. This issue arises within ...

cssreactjsnext.jstailwind-css

A circular overflow div showcasing an image

While Chrome is able to effectively contain an image within an overflow:hidden rounded div, Safari seems to struggle with this task as the overflow:hidden property does not seem to work properly. Here is an example: Below is the SASS code I am using: .p ...

css

Create a sinusoidal wave and stream it through the web browser

I'm looking for a code snippet that can: create a sine wave (an array of samples) play the wave This should all be accomplished in a web browser using an HTML5 API in JavaScript. (I've tagged this with web-audio, but I'm not entirely ...

javascripthtmlaudiocross-browserweb-audio-api

Unable to access Bootstrap nav link

There seems to be an issue with a link inside the Bootstrap nav-menu. The link is not opening when clicked on. https://i.sstatic.net/lrXmD.jpg I am facing trouble with the Cart file as it does not open when I click on the Cart hyperlink. I have double-ch ...

htmlcsstwitter-bootstrap

Troubleshooting Problem with Button Image Display in CSS

I have created a custom CSS for a PayPal sprite that I made. Below is an image comparison showing how it appears in Internet Explorer and Firefox. Here is the code to display the sprite: .ppsprite { background: url('/images/paypal_sprite.png') ...

css

Tips for Selenium: Automatically Save PDFs from Webpages without a Download Button

1.) How can I download Article PDF files from multiple web pages to a local folder on my computer using Selenium if there is no "Download PDF" button available? 2.) I thought about using keyboard keys for printing such as "Control - P", but none of the ke ...

htmlpython-3.xseleniumpdfbrowser-automation

Directive isolated scope is encountering an undefined $scope variable

After searching through various Stack Overflow posts on the issue, I have tried different solutions but still can't get my directive to render. The goal is to pass an integer to my directive within an ng-repeat loop and display an emoji based on that ...

javascripthtmlangularjsangularjs-directivedirective