Search code examples
htmlcssimagecontainersmax-size

How to set a fixed size for img tag?


I want the img to have a fixed size let's say for example 290x193 and don't get changed with the image's actual width and height, I tried inline CSS on img tag but it does not work. is there any bootstrap class for this purpose rather than defining CSS?

here is my code:

           <?php foreach($articles as $articl): ?>
            <div class="col-md-6">
            <a href="blog-single.php" class="blog-entry element-animate" data-animate-effect="fadeIn">
              <img style="width: 290; height:193;" src="<?php echo BASE_URL . '/assets/images/' . $articl['image'] ?>" alt="Image placeholder">
              <div class="blog-content-body">
                <div class="post-meta">
                  <span class="category">Food</span>
                  <span class="mr-2"><?php echo date('F j, Y',strtotime($articl['entry_date'])) ?></span> &bullet;
                  <span class="ml-2"><span class="fa fa-comments"></span> 3</span><br>
                  <span class="mr-2">By: <?php echo $articl['name'].' '.$articl['last_name'] ?> </span>
                </div>
                <h2><?php echo $articl['title'] ?></h2>
                <p><?php echo substr($articl['abstract'], 0, 80).'...' ?></p>
              </div>
            </a>
          </div>
          <?php endforeach;?>

Solution

  • You forgot writing px in your inline styling, after each number