Forums

The forums ran from 2008-2020 and are now closed and viewable here as an archive.

Home Forums Other WordPress Images

  • This topic is empty.
Viewing 8 posts - 1 through 8 (of 8 total)
  • Author
    Posts
  • #38771
    chrisburton
    Participant

    I’m starting to style my portfolio site but I’m having an issue when it comes to displaying the images. In my CSS, I’ve declared the list item to have a width of 230px but somehow WordPress is not complying and is setting its own width (see image attached). It’s also setting a margin on it’s own and I can’t seem to remove it, but I can add to it. Really odd.

    #105344
    chrisburton
    Participant

    @ChrisxClash Then why are some of the other thumbnails 230px by 230px?

    #105346
    chrisburton
    Participant

    Oh my, I’m embarrassed. I was quickly hovering, not seeing that it was the image itself that were different widths. My fault.

    However, I still can’t seem to remove the margin that WordPress is setting.

    #105350
    TheDoc
    Member

    You know how it works, bud! If you’ve got a link you’ll get it solved super quick!

    #105352
    chrisburton
    Participant

    @TheDoc I’m totally new here.

    So I narrowed the issue down to ‘inline-block‘ but have no idea how to remove the whitespace since I won’t be able to alter the HTML.

    Fiddle

    #105353
    chrisburton
    Participant

    Solved by adding font-size: 0; to the ul tag.


    @joshuanhibbert
    You should put this solution on your blog as I went there to find an alternate solution but couldn’t find one that suits not being able to alter the markup.

    #105356
    TheDoc
    Member

    The margin is actually being caused by white space in the markup, an unfortunate side effect.

    Using the font-size trick is a little hackish, I suppose, but it could work in this case.

    The only problem you might encounter is if you do eventually want text in there, perhaps for captions.

    #105382
    chrisburton
    Participant

    @TheDoc Yeah, that’s what I read on Josh’s blog and one of the articles here. I really hate the way WordPress displays your markup in view source. The code is extremely misaligned and adds ridiculous amounts of spacing so using font-size: 0; was a perfect solution. Thanks Gray.

Viewing 8 posts - 1 through 8 (of 8 total)
  • The forum ‘Other’ is closed to new topics and replies.