Image appears too big on webpage

Discussion in 'HTML' started by adminmax@gmail.com, Aug 3, 2008.

  1. Guest

    Hello!

    Im just getting started with websites and everything and this seem to
    be very basic.... but for the life of me i cannot see where the
    problems comes from!

    When i put a paypal donate button on my page, it appears 3x bigger,
    all pixelated. then if i right click on the image and "view image", it
    appears just the right size...

    I got the code from the paypal website so i dont think its coming from
    there...

    Maybe from my css image settings?

    #content img, #contentwide img, #contentfull img {
    padding:1px;
    display:inline;
    background:#cccccc;
    color:#303030;
    border:4px solid #f0f0f0;

    But i tried to change those and nothing happened... :s

    Thanks
     
    , Aug 3, 2008
    #1
    1. Advertising

  2. wrote:
    > Hello!
    >
    > Im just getting started with websites and everything and this seem to
    > be very basic.... but for the life of me i cannot see where the
    > problems comes from!
    >
    > When i put a paypal donate button on my page, it appears 3x bigger,
    > all pixelated. then if i right click on the image and "view image", it
    > appears just the right size...
    >
    > I got the code from the paypal website so i dont think its coming from
    > there...
    >
    > Maybe from my css image settings?
    >
    > #content img, #contentwide img, #contentfull img {
    > padding:1px;
    > display:inline;
    > background:#cccccc;
    > color:#303030;
    > border:4px solid #f0f0f0;
    >
    > But i tried to change those and nothing happened... :s
    >


    Are you using "width" and "height" attributes that are 3x the actual
    image size perhaps? A URL would have provided a definitive answer.

    --
    Take care,

    Jonathan
    -------------------
    LITTLE WORKS STUDIO
    http://www.LittleWorksStudio.com
     
    Jonathan N. Little, Aug 3, 2008
    #2
    1. Advertising

  3. Guest

    On Aug 3, 8:11 pm, Neredbojias <me@http://www.neredbojias.net/_eml/
    fliam.php> wrote:
    > On 03 Aug 2008, wrote:
    >
    >
    >
    > > Hello!

    >
    > > Im just getting started with websites and everything and this seem to
    > > be very basic.... but for the life of me i cannot see where the
    > > problems comes from!

    >
    > > When i put a paypal donate button on my page, it appears 3x bigger,
    > > all pixelated. then if i right click on the image and "view image", it
    > > appears just the right size...

    >
    > > I got the code from the paypal website so i dont think its coming from
    > > there...

    >
    > > Maybe from my css image settings?

    >
    > > #content img, #contentwide img, #contentfull img {
    > > padding:1px;
    > > display:inline;
    > > background:#cccccc;
    > > color:#303030;
    > > border:4px solid #f0f0f0;

    >
    > > But i tried to change those and nothing happened... :s

    >
    > What the hell is a "paypal donate" button?
    >
    > Anyway, somewhere else in your mystical page is a height and/or width
    > parameter for the "img" attribute. Best to set accurate dimensions
    > css-wise on the id of the img you're referring to.
    >
    > --
    > Neredbojiashttp://www.neredbojias.net/
    > Great sights and sounds




    Hello! paypal donate button is to allow visitors to make a donation
    through paypal... may be my wording is wrong.

    back to the image: there is no width and height attribute set, and
    when i try to set them somehow the width doesnt work only the height
    changes :S here is the code of the image:

    <input type="image" src="https://www.paypal.com/en_US/i/btn/
    btn_donate_LG.gif" border="1" name="submit" alt="PayPal - The safer,
    easier way to pay online!">

    i tried to put it like this : <input type="image" src="https://
    www.paypal.com/en_US/i/btn/btn_donate_LG.gif" width="92" height="26"
    border="1" name="submit" alt="PayPal - The safer, easier way to pay
    online!">

    The height got perfect but somehow whatever value i put in width,
    nothing happens, its still 3times too wide
     
    , Aug 3, 2008
    #3
  4. On Aug 3, 11:27 am, wrote:
    > On Aug 3, 8:11 pm, Neredbojias <me@http://www.neredbojias.net/_eml/
    >
    >
    >
    > fliam.php> wrote:
    > > On 03 Aug 2008, wrote:

    >
    > > > Hello!

    >
    > > > Im just getting started with websites and everything and this seem to
    > > > be very basic.... but for the life of me i cannot see where the
    > > > problems comes from!

    >
    > > > When i put a paypal donate button on my page, it appears 3x bigger,
    > > > all pixelated. then if i right click on the image and "view image", it
    > > > appears just the right size...

    >
    > > > I got the code from the paypal website so i dont think its coming from
    > > > there...

    >
    > > > Maybe from my css image settings?

    >
    > > > #content img, #contentwide img, #contentfull img {
    > > > padding:1px;
    > > > display:inline;
    > > > background:#cccccc;
    > > > color:#303030;
    > > > border:4px solid #f0f0f0;

    >
    > > > But i tried to change those and nothing happened... :s

    >
    > > What the hell is a "paypal donate" button?

    >
    > > Anyway, somewhere else in your mystical page is a height and/or width
    > > parameter for the "img" attribute.  Best to set accurate dimensions
    > > css-wise on the id of the img you're referring to.

    >
    > > --
    > > Neredbojiashttp://www.neredbojias.net/
    > > Great sights and sounds

    >
    > Hello! paypal donate button is to allow visitors to make a donation
    > through paypal... may be my wording is wrong.
    >
    > back to the image: there is no width and height attribute set, and
    > when i try to set them somehow the width doesnt work only the height
    > changes :S here is the code of the image:
    >
    > <input type="image" src="https://www.paypal.com/en_US/i/btn/
    > btn_donate_LG.gif" border="1" name="submit" alt="PayPal - The safer,
    > easier way to pay online!">
    >
    > i tried to put it like this : <input type="image" src="https://www.paypal.com/en_US/i/btn/btn_donate_LG.gif" width="92" height="26"
    > border="1" name="submit" alt="PayPal - The safer, easier way to pay
    > online!">
    >
    > The height got perfect but somehow whatever value i put in width,
    > nothing happens, its still 3times too wide


    You need to provide the URL of the webpage that is broken. Chances
    are the solutions is simple. But until we see the actual page that is
    broken we can only guess at what you did wrong.

    --
    Travis
    Flash Crap: http://travisnewbury.blogspot.com
     
    Travis Newbury, Aug 3, 2008
    #4
  5. Bergamot Guest

    wrote:
    >
    > i tried to put it like this : <input type="image" src="https://
    > www.paypal.com/en_US/i/btn/btn_donate_LG.gif" width="92" height="26"
    >
    > The height got perfect but somehow whatever value i put in width,
    > nothing happens, its still 3times too wide


    If you validated your code, you'd see that neither width nor height (nor
    border) is a valid attribute for the input element, even a type="image".
    It would be a surprise if any browsers did as you asked. You don't need
    to specify dimensions for image inputs, anyway because the actual
    dimensions will be used.

    If you're trying to resize the image, better to use a different graphic
    that already has the correct dimensions, or use a standard plain text
    submit button and style it with CSS. The usual caveat about browser
    support for styling form controls applies, of course.

    --
    Berg
     
    Bergamot, Aug 3, 2008
    #5
  6. Guest

    On Aug 4, 4:46 am, Neredbojias <me@http://www.neredbojias.net/_eml/
    fliam.php> wrote:
    > On 03 Aug 2008, wrote:
    >
    >
    >
    > >> Anyway, somewhere else in your mystical page is a height and/or width
    > >> parameter for the "img" attribute. Best to set accurate dimensions
    > >> css-wise on the id of the img you're referring to.

    >
    > > Hello! paypal donate button is to allow visitors to make a donation
    > > through paypal... may be my wording is wrong.

    >
    > > back to the image: there is no width and height attribute set, and
    > > when i try to set them somehow the width doesnt work only the height
    > > changes :S here is the code of the image:

    >
    > > <input type="image" src="https://www.paypal.com/en_US/i/btn/
    > > btn_donate_LG.gif" border="1" name="submit" alt="PayPal - The safer,
    > > easier way to pay online!">

    >
    > > i tried to put it like this : <input type="image" src="https://
    > >www.paypal.com/en_US/i/btn/btn_donate_LG.gif" width="92" height="26"
    > > border="1" name="submit" alt="PayPal - The safer, easier way to pay
    > > online!">

    >
    > > The height got perfect but somehow whatever value i put in width,
    > > nothing happens, its still 3times too wide

    >
    > I think Bergamot is right about it being an input (-as opposed to image),
    > so it's probably expanding to the default _input_ width. Try removing the
    > width="92" height="26" and instead do a style like <input type="image"
    > style="width:92px;"... Another thing which may be advantageous is to set
    > the input to display:block;
    >
    > --
    > Neredbojiashttp://www.neredbojias.net/
    > Great sights and sounds


    here is the link :

    http://tranceendnow.com/contact.html

    ???

    Thanks
     
    , Aug 4, 2008
    #6
  7. dorayme Guest

    In article
    <>,
    wrote:

    > Hello!
    >
    > Im just getting started with websites and everything and this seem to
    > be very basic.... but for the life of me i cannot see where the
    > problems comes from!
    >
    > When i put a paypal donate button on my page, it appears 3x bigger,
    > all pixelated. then if i right click on the image and "view image", it
    > appears just the right size...
    >
    > I got the code from the paypal website so i dont think its coming from
    > there...
    >
    > Maybe from my css image settings?
    >
    > #content img, #contentwide img, #contentfull img {
    > padding:1px;
    > display:inline;
    > background:#cccccc;
    > color:#303030;
    > border:4px solid #f0f0f0;
    >
    > But i tried to change those and nothing happened... :s
    >



    For a quick fix, remove

    input {
    width:200px;
    }

    from your stylesheet.

    --
    dorayme
     
    dorayme, Aug 4, 2008
    #7
  8. Ari Heino Guest

    > <input src="https://www.paypal.com/en_US/i/btn/btn_donate_LG.gif"
    > name="submit" alt="PayPal - The safer, easier way to pay online!" border="1"
    > type="image" style="width:92px;height:26px;">


    Border is not a valid attribute for input. Use CSS instead. Also note
    the closing of the tag when using xhtml. Below is what you need.

    <input src="contact_tiedostot/btn_donate_LG.gif" name="submit"
    alt="PayPal - The safer, easier way to pay online!" type="image"
    style="width: 92px; height: 26px; border: 0;" />

    --
    Ari
     
    Ari Heino, Aug 4, 2008
    #8
  9. Guest

    On Aug 4, 3:24 pm, Ari Heino <> wrote:
    > > <input src="https://www.paypal.com/en_US/i/btn/btn_donate_LG.gif"
    > > name="submit" alt="PayPal - The safer, easier way to pay online!" border="1"
    > > type="image" style="width:92px;height:26px;">

    >
    > Border is not a valid attribute for input. Use CSS instead. Also note
    > the closing of the tag when using xhtml. Below is what you need.
    >
    > <input src="contact_tiedostot/btn_donate_LG.gif" name="submit"
    > alt="PayPal - The safer, easier way to pay online!" type="image"
    > style="width: 92px; height: 26px; border: 0;" />
    >
    > --
    > Ari


    Works!!

    Thanks everybody!
     
    , Aug 4, 2008
    #9
    1. Advertising

Want to reply to this thread or ask your own question?

It takes just 2 minutes to sign up (and it's free!). Just click the sign up button to choose a username and then you can ask your own questions on the forum.
Similar Threads
  1. Martin
    Replies:
    0
    Views:
    489
    Martin
    Aug 4, 2004
  2. Shaguf
    Replies:
    0
    Views:
    539
    Shaguf
    Dec 24, 2008
  3. Shaguf
    Replies:
    0
    Views:
    496
    Shaguf
    Dec 26, 2008
  4. Shaguf
    Replies:
    0
    Views:
    269
    Shaguf
    Dec 26, 2008
  5. Shaguf
    Replies:
    0
    Views:
    244
    Shaguf
    Dec 24, 2008
Loading...

Share This Page