Solved: Images won't reduce. | Experts Exchange

Create Account

HTML

Questions

Followers

Top Experts

David Schure

Images won't reduce.

Hi i am trying to resize the images on this page,
http://www.mediascrubber.com/Jobs.html
No matter what I change they wont change in size.
the image workers.png is 550px x 326px and it looks streched vertically.
The other problem is the three blue images are 300px x 300px and they won't reduce. I tried 500px x 500px and 400px x 400px and it never changed.

Zero AI Policy

We believe in human intelligence. Our moderation policy strictly prohibits the use of LLM content in our Q&A threads.

Jeffrey Dake🇺🇸

How are you changing them? Are you updating height and width inline on the images, or using css?

Shaun Vermaak🇦🇺

For one your attributes need a space

height:"300px"align="right"

Open in new window

should be

height:"300px" align="right"

Open in new window

David Schure

ASKER

Yes its in CSS, trying to find where the restrictions are coming from...

<section id="shop-contanier">
    <div class="section">
        <div class="FAQTitle"><b>Available Positions</b></div>
        <div class="shop-items">
            <div class="s-item wow fadeInUp">
                <div class="job">
                    <img src="resources/images/Marketing300.png" alt="Marketing" width="300" height="300">
                </div>

Open in new window

EARN REWARDS FOR ASKING, ANSWERING, AND MORE.

Earn free swag for participating on the platform.

Jeffrey Dake🇺🇸

I don't see any CSS being applied on that page to the Images, what are your CSS rules?

David Schure

ASKER

Okay got the workers.png straightened out, I cleaned up the divs ad enclosed it in its own div.

Now onto the three blue images...

ASKER CERTIFIED SOLUTION

Chris Stanyon🇬🇧

membership

Signing up is free and takes 30 seconds. No credit card required.

Create Account

lenamtl🇨🇦

Hi,

I would use % instead of pixel with max-height (or max-width)

Check here for image helper and position
https://getbootstrap.com/docs/4.4/content/images/

You can use the class of

img-fluid

Open in new window

When using Bootstrap don't use inline CSS as it can break Bootstrap logical.
(these days it is not a good idea to use inline CSS in general)

Ref for max-width
https://developer.mozilla.org/en-US/docs/Web/CSS/max-width
Ref for max-height
https://developer.mozilla.org/en-US/docs/Web/CSS/max-height

Get a FREE t-shirt when you ask your first question.

We believe in human intelligence. Our moderation policy strictly prohibits the use of LLM content in our Q&A threads.

David Schure

ASKER

Thank you lenamtl it seems that i should be learning bootstrap!!!! Looks like a good thing!!!!!!

HTML

Questions

Followers

Top Experts

HTML (HyperText Markup Language) is the main markup language for creating web pages and other information to be displayed in a web browser, providing both the structure and content for what is sent from a web server through the use of tags. The current implementation of the HTML specification is HTML5.