make the text in em font size larger

Incorporating HTML dynamically into a page using JavaScript is shown in the example below.

      _strInnerHtml += "<em>" + value.cate_name + " | " + value.city_name + "</em>";
      _strInnerHtml += "<a href='#' class='activity-item-toggle'><i class='fa'></i></a>";
      _strInnerHtml += "<div class='activity-item-detail'>";
      _strInnerHtml += "<em>Address 1 : " + value.dire_address_1 + "</em>";
      _strInnerHtml += "<em>City : " + value.city_name + "</em>";
      _strInnerHtml += "</div>";
      _strInnerHtml += "</div>";

I am attempting to increase the font-size of the em, but encountering difficulty.

Here is my attempted solution:

.activity-item-detail{
         font-size:15px;
         }
javascripthtmlcss

Answer №1

To determine the font size attribute of actvity-item-detail, utilize Chrome's tools for inspection. It may be beneficial to implement a more precise solution such as:

.activity-item-detail em {
    font-size: 15px;
}

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

Tips for concealing tick labels in d3 using TypeScript

When trying to hide tick labels by passing an empty string to the .tickFormat("") method, I encountered an issue with Typescript. The error message received was as follows: TS2769: No overload matches this call. Overload 1 of 3, '(format: null): Axi ...

javascriptreactjstypescriptd3.js

Incorporating library files (css/js) into your app built on the angular-fullstack framework

After using a Yo Angular-Fullstack generator (https://github.com/DaftMonk/generator-angular-fullstack) to start an app, I attempted to install Toastr from bower with the command: bower install angular-toastr Now, I need to add the toastr css and js files ...

javascriptcssangularjsnode.jsyeoman

Utilize the power of Vuejs' v-for directive to populate not only the table rows, but also its header with

Can a single object be used to populate both table headers and rows? I attempted to do so with the code below: <table v-for="(table, index) in tables" :key="index"> <thead> <tr> <th> {{ table. ...

htmlvue.jsloopshtml-tablev-for

What is preventing the table from extending to the full 100% width?

Displayed above is an image showing an accordion on the left side and content within a table on the right side. I have a concern regarding the width of the content part (right side) as to why the table is not occupying 100% width while the heading at the ...

javascriptjqueryhtmlcssjqgrid

The attempt to log in using AJAX and PHP was unsuccessful

Why does the output always show a false alert even though the email and password match those in the database? PHP: <?php include 'db.php'; $email = trim($_POST['email']); $password = trim($_POST['password'] ...

javascriptphpjqueryajaxauthentication

Alter the color of a single character using JQuery, all while keeping the HTML tags unchanged

I'm currently working on iterating through the DOM using JQuery in order to change the color of every occurrence of the letter m. Here is what I have so far: $(document).ready(function(){ var m = "<span style='color: red;'>m</span& ...

javascriptjqueryhtmldomdom-manipulation

When the button onClick event is not functioning as expected in NextJS with TypeScript

After creating a login page with a button to sign in and hit an API, I encountered an issue where clicking the button does not trigger any action. I have checked the console log and no errors or responses are showing up. Could there be a mistake in my code ...

javascripttypescriptnext.js

The CSS styling for an active link is not functioning correctly on a single page when using sections

I recently received a zip file containing a template purchased from themeforest, with a request to make modifications. The template includes a horizontal navigation bar with links to various sections on the page. In the original template, when you click on ...

htmlcss

Closures are like the "use" keyword in PHP or the capture list in C++, but they play a similar role in JavaScript and other transpiler languages

PHP has a useful feature with the use keyword, which allows for the usage of 'external' variables in closures. For example: $tax = 10; $totalPrice = function ($quantity, $price) use ($tax){ //mandatory 'use' return ($price * $quan ...

javascriptphpc++11typescriptclosures

Display an Image using the <img> tag with the help of PHP

I have a simple question that I can't seem to figure out. I want to display an image in an src tag loaded from a PHP MySQL database. Here's what I've tried: <ul> <?php $sql = "SELECT * FROM advertisement_ ...

phphtmlmysqlimage

"Troubleshooting Why AJAX Update for CGridView is Not Functioning

I've encountered an issue with my CGridView grid where I receive an error every time I try to update it. Despite spending a lot of time trying to resolve this, I still haven't been able to figure out what's missing. Here's the code sni ...

javascriptjqueryajaxyiicgridview

Responsive issue identified with Bootstrap navbar hamburger menu upon clicking

My website has an issue on mobile where the hamburger menu appears but doesn't respond when clicked. I'm unsure what's causing this problem in my code. <nav class="navbar navbar-expand-lg navbar-light bg-light"> <a ...

htmlcsswebbootstrap-4navbar

Understanding React: Why 'props' Property Cannot Be Read

Recently, I made the decision to delve into learning React and chose to begin with the official tutorial. Everything was going smoothly until I reached a specific portion of my code: var CommentBox = React.createClass({ render: () => { return ( ...

javascriptreactjs

I am facing difficulties in installing node packages using npm install

Trying to install node packages using npm, but encountering an issue. When I run the command, the output is: up to date, audited 356 packages in 7s found 0 vulnerabilities I have listed the dependencies in my package.json file like so: "dependencies& ...

javascriptnode.jsnpmnpm-install

Experiencing issues and alerts when handling JSON data

Here is the Json data I am attempting to represent using Json-LD : var schemaOrg = angular.toJson({ "@context": "http://schema.org", "@type": "RealEstateAgent", "RealEstateAgent": { ...

javascriptjsonangularjsjson-ld

Looking to retrieve information stored in a JSON stringified object

Struggling with accessing the selected cell from an addListener event in Google Visualization Calendar is my current challenge. By utilizing JSON.stringify(chart.getSelection());, I am able to successfully print out the selected cell, which appears as [{"d ...

javascriptjsononclickgoogle-visualization

Issue accessing member value in inherited class constructor in Typescript

My situation involves a class named A, with another class named B that is inherited from it. class A { constructor(){ this.init(); } init(){} } class B extends A { private myMember = {value:1}; constructor(){ super(); ...

javascripttypescriptoopinheritanceecmascript-6

Navigation bar subtitle with items aligned to the right

My navigation bar includes a subtitle, and I implemented the technique found here to add it. However, after adding the subtitle, my nav bar lost its right alignment. Some items in the nav bar need to be aligned to the right, but they are no longer since I ...

htmlbootstrap-4

Tips for identifying a pair of numbers (with varying ranges) in which one number must be present at all times

I am currently trying to understand the regex I have implemented in Angular 2 using Typescript: /[0-5]?[0-9]?/ Surprisingly, this regular expression works flawlessly to match any valid minute from 1 to 59, even though it seems like an empty string would ...

javascriptregexangular

Implementing external JavaScript files such as Bootstrap and jQuery into a ReactJS application

Just diving into ReactJs, I've got static files like bootstrap.min.js, jquery.min.js, and more in my assets folder. Trying to incorporate them into my ReactJs App but running into issues. Added the code below to my index.html file, however it's ...

javascriptjqueryreactjsbootstrap-4