1

I want to add styles to all divs with "cont" in their class. How can I do that? I tried with div[class ~= "cont"] but it doesn't work. Am I doing something wrong?

<!DOCTYPE html>
<html>
<head>
    <title></title>
    <link rel="stylesheet" type="text/css" href="../css/infopersonal.css">
</head>
<body>
    <div>
        <div class="cont-1">1</div>
        <div class="cont-2">2</div>
        <div class="cont-3">3</div>
        <div class="cont-4">4</div>
        <div class="div-5">5</div>
    </div>
</body>
</html>
Jhoan Nicolas Andres Becerra Q
  • 543
  • 4
  • 14

2 Answers2

2

You can either use ^ if you want the string to begin with cont or * to verify the string in the class.

div[class^="cont"] {
  background: red;
  border:1px solid black;
}
<html>
<head>
    <title></title>
    <link rel="stylesheet" type="text/css" href="../css/infopersonal.css">
</head>
<body>
    <div>
        <div class="cont-1">1</div>
        <div class="cont-2">2</div>
        <div class="cont-3">3</div>
        <div class="cont-4">4</div>
        <div class="div-5">5</div>
    </div>
</body>
</html>
Manjuboyz
  • 6,978
  • 3
  • 21
  • 43
2

Instead of ~ please use * So your css definition would be as follow

div[class*="cont"]

lalitrane
  • 90
  • 4