css Question posted in
Some basic documentation can be found here.

Css – Bolding text is not working in different devices

Is bolding text is affected by screen type?

This is JSX in react:

function App() {
  return (
    // Problem Here
    <b className="info-text">Info:{" "}</b>
  );
}

ReactDOM.render(<App />, document.getElementById("root"));
.info-text {
  font-size: 14px;
  font-weight: bolder;
  line-height: 24px;
  color: #15366D;
}
<script src="https://cdn.jsdelivr.net/npm/react/umd/react.production.min.js"></script>
<script src="https://cdn.jsdelivr.net/npm/react-dom/umd/react-dom.production.min.js"></script>

<div id="root"></div>
Tags:

2

Answers


  1. 0

    You can use specific numeric values for font-weight (e.g., 600 for semi-bold, 700 for bold).

    Login or Signup to reply.
  2. 0

    I think you should use the <span> tag rather than the <b> tag.

    See this example:

    .info-text {
  font-size: 14px;
  font-weight: bold;
  line-height: 24px;
  color: #f00;
}
    <span class="info-text">
  Info
</span>

    Note: Do convert this into JSX and use className instead of class.

    Login or Signup to reply.
Please signup or login to give your own answer.

Back To Top
Search