Hello and welcome to our community! Is this your first visit?
Register
Enjoy an ad free experience by logging in. Not a member yet? Register.
Results 1 to 5 of 5
  1. #1
    Senior Coder
    Join Date
    May 2006
    Posts
    1,683
    Thanks
    28
    Thanked 4 Times in 4 Posts

    Why do my images not size correctly ?

    Hello

    I have two images that have dimensions at
    92px x 92px and at 120px x 120px

    I want then displayed neatly next to each other so
    I tried to give them dimensions via the CSS like
    this:


    Code:
    <a href="about.php"><img class="seal" src="images/guarantee_gray.gif" alt="guarantee" title = "guarantee" ></a>
    	<a href="about.php"><img class="seal" src="images/money-back.gif" alt="money back" title = "money back" ></a>
    and css:
    Code:
    .seal {
      width: 90px;
      height:90px;
    }
    Unfortunately they do not comply

    They dsplay at there own normal size.

    What have I done wrong ?

    Any help appreciated !


    Thanks

  • #2
    Regular Coder
    Join Date
    Jan 2009
    Posts
    316
    Thanks
    7
    Thanked 92 Times in 91 Posts
    The code is valid. My guess would be a typo somewhere.

    Is your CSS properly linked? Try putting it in the head of the code and see if it works.

    Code:
    <style type="text/css">
    .seal {
    	width: 100px;
    	height:100px;
    }
    </style>

  • #3
    New Coder
    Join Date
    Feb 2009
    Location
    Norway, Europe
    Posts
    94
    Thanks
    12
    Thanked 2 Times in 2 Posts
    Try this. Tell me if it works:
    <a href="about.php"><img style="width: 90px; height: 90px;" src="images/guarantee_gray.gif" alt="guarantee" title="guarantee" /></a>
    <a href="about.php"><img style="width: 90px; height: 90px;" src="images/money-back.gif" alt="money back" title = "money back" /></a>

    (Remember to close your <img />s)

    If this doesn't work, just reply, and I'll try again. Maybe post the entire code?
    Always Use a DOCTYPE!
    Always Use * {margin: 0; border: none; padding: 0;} in the top of your CSS stylesheet.
    Always Use only CSS for layout; never (X)HTML.
    Always Have fun while coding!

  • #4
    Senior Coder
    Join Date
    May 2006
    Posts
    1,683
    Thanks
    28
    Thanked 4 Times in 4 Posts
    The inline style works fine

    I will play about with it, thanks

  • #5
    New Coder
    Join Date
    Feb 2009
    Location
    Norway, Europe
    Posts
    94
    Thanks
    12
    Thanked 2 Times in 2 Posts
    Have you tried JUST adding a slash at the end of <img>?

    EDIT: also, try changing .seal to img.seal in your CSS
    Always Use a DOCTYPE!
    Always Use * {margin: 0; border: none; padding: 0;} in the top of your CSS stylesheet.
    Always Use only CSS for layout; never (X)HTML.
    Always Have fun while coding!


  •  

    Posting Permissions

    • You may not post new threads
    • You may not post replies
    • You may not post attachments
    • You may not edit your posts
    •