Skip to:
Content
Pages
Categories
Search
Top
Bottom

Colours around images in “Allow Images”


  • kannued
    Participant

    @kannued

    When I input the code to include the image in a post, my image is surrounded by the post-form colour. In other words, I have an image with a white background which is surrounded by the post-form colour. The image is the only content in the post.

    Posts without images are surrounded by the post content colour. In other words, the text has a white background throughout. No post-form colour as in the outer edge of the image.

    How can I change so that the image is surrounded by the post content colour, in this case white, instead of the post-form colour?

    Using bbpress .9.0.2, with allow images .7.1

Viewing 10 replies - 1 through 10 (of 10 total)

  • chrishajer
    Participant

    @chrishajer

    Link to your forum?


    chrishajer
    Participant

    @chrishajer

    The link that was posted gave me a 404 error. Maybe someone will be able to resolve it by knowing off-hand rather than having to see it.


    _ck_
    Participant

    @_ck_

    Probably needs a css tweak but I’d need a demo.


    kannued
    Participant

    @kannued

    I had the 404 too when I tested from the post. Then I wondered if there was a no follow. So I copied the link, then pasted it into a new window or tab. It worked then.


    kannued
    Participant

    @kannued

    I added this

    .threadpost img
    {
    background-color: transparent;
    max-width:100%;
    }

    But it didn’t change anything. The max-width is to restrict larger images.

    Until someone who know what they’re doing chimes in… you could use CSS Selectors (of your own making e.g. ‘foo’) to trap and apply styles to elements with the ‘foo’ attribute…

    [foo]        -- Has an attribute named "foo"
    [foo="bar"] -- Has an attribute named "foo" with a value of "bar" ("bar")
    [foo~="bar"] -- Value has the word "bar" in it somewhere ("blue bar stools")
    [foo^="bar"] -- Value begins with "bar" ("barstool")
    [foo$="bar"] -- Value ends with "bar" ("I was at the bar")
    [foo*="bar"] -- Value has bar somewhere ("I was looking for barstools")

    So I guess, if you had <img foo='inpost'... and

    [foo ="inpost"] { background-color: transparent; max-width:100%;} that might work.

    If you posted an actual link to the test site (or emailed it), folks could use FF web developer plugins etc to nail down the CSS tree for that theme…

    I hope this helps.


    kannued
    Participant

    @kannued

    I did use web developer tool. The buffalo’s outer box is div class=”threadpost”. Then the next box which the picture sits in is div class=”post”. For the text only post, the outer box sits outside of the threadpost, inside the thread li.

    I would be willing to email the link to the moderators or to yourself. But I’m not willing to post the link here for the test site.

    I’m only 3 days new to bbPress so I hope I don’t steer you wrong…

    There are probably alternating colors too…

    #thread li.alt .threadpost
    #thread li .threadpost

    I think it’s the background color of the li not the img to be changed…

    Hmm, I’m going to bow out, sorry. The solution is probably ridiculously facile and I look forward to seeing it. A bbPress content filter for the img tag inside an li?

    Sorry!


    kannued
    Participant

    @kannued

    Musnake, you had the solution. If I had posted another reply, I would have seen that, of course, the posts alternate background colours. Thank you for pointing me in the right direction. Essentially, there was nothing wrong.

    Related to this, the width of the text-alone box is wider than the image-only post. In sending more posts to the topic, the first one with the buffalo seems to have set the width for that alternate color. Then the white text only background is the width for all subsequent posts of that color. Isn’t the idea to have the same width for all the posts? Isn’t that how it is designed?


    kannued
    Participant

    @kannued

    I solved the width problem!

Viewing 10 replies - 1 through 10 (of 10 total)

You must be logged in to reply to this topic.