Unable to properly aglign an image to the left side.

  • Resolved Anthyx

    (@anthyx)


    10 years, 9 months ago

    Hi,

    I’m unable to correctly align an image on the left of a page.

    Since I was not sure about my original, heavy customized twenty eleven child theme, I set up a fresh installation.

    The problem is still there: I set a page width of 1000px, I place an image 1000px large, setting it as centered, but it goes slightly to the right (almost 10px).

    It’s not resized (as I want), but it’s slightly moved on the right, going even further the right side limit.

    These are the only “new” values present in my style.css child theme, all the rest is inherited from a fresh, untouched, twenty eleven parent installation:

    ******

    body, input, textarea {
    color: #373737;
    font: 13px “Helvetica Neue”, Helvetica, Arial, sans-serif;
    font-weight: 300;
    line-height: 1.625;
    }

    .one-column #page {
    max-width: 1000px;
    min-width: 1000px;
    }

    .one-column #content {
    margin: 0 auto;
    width: auto;
    }

    img[class*=”align”],
    img[class*=”wp-image-“],
    #content .gallery .gallery-icon img {
    border: none;
    }

    .entry-content img,
    .comment-content img,
    .widget img {
    max-width: 100%;
    }

    I underline the fact that ALL other values are the original ones.

    There must be some default setting in twenty eleven that places a small invisible border or “something” around images or to their left side, preventing it a correct alignment, but I can’t find it.

    Please please please help!

    Many thanks!

    A.

Viewing 2 replies - 1 through 2 (of 2 total)
  • esmi

    (@esmi)

    10 years, 9 months ago

    Are you using a child theme or a custom CSS plugin?

    Thread Starter Anthyx

    (@anthyx)

    10 years, 9 months ago

    Hi Esmi,

    I’m using a child theme.

    Anyway I found the problem: it seems all inserted images, by default, are surrounded by a frame defined by this string:

    img[class*=”align”], img[class*=”wp-image-“], #content .gallery .gallery-icon img {
    border: 1px solid #DDDDDD;
    padding: 6px;

    Strange thing is that this frame is present even if these images are not a links.
    Result is that this frame has his own width, and that was exactly the small space not allowing me to correct align an image inside the page body or a cell/table.

    Solution is to set to zero the values:

    img[class*=”align”], img[class*=”wp-image-“], #content .gallery .gallery-icon img {
    border: 0px solid #DDDDDD;
    padding: 0px;

    Now everything is fine. Thanks again for your interest in my problem.

    A.

Viewing 2 replies - 1 through 2 (of 2 total)
  • The topic ‘Unable to properly aglign an image to the left side.’ is closed to new replies.