Padding on images inexplicably larger on bottom

piperchick
Topic Author
Offline
Premium Member

13 years 8 months ago #10042 by piperchick

Padding on images inexplicably larger on bottom was created by piperchick

I have added a border to my images and it doesn't add evenly all the way around. There is an extra px or 2 at the bottom. Please see the attached screen shot.

I have looked at this in Fire Bug but can't see where to change the CSS.

The live page is here:
deadcanadians.ca/index.php?optio ... &Itemid=83

I should mention that if you look at the live site, the portrait is ok because that is not a Flexi image field, I have embedded that image. The headstone is a Flexi image, which is the problem.

Thanks.

Lovin' FLEXIcontent at deadcanadians.ca
Dead Canadians: where are they now?

Attachments:

Please Log in or Create an account to join the conversation.

vlester
Offline
Premium Member

13 years 8 months ago #10044 by vlester

Replied by vlester on topic Padding on images inexplicably larger on bottom

The css to modify is in components/com_flexicontent/templates/people/css/item.css
div.headstoneimage (ligne 116)

But your code source is weird, you have span in each position, and I don't see why they're here

Code:

<!-- BOF headstoneimage block -->
    <div class="headstoneimage field_img_headstone"><span title="div .headstoneimage field_img_headstone 62" class="webdeveloper-display-div-order">div .headstoneimage field_img_headstone 62</span>
      <a href="/images/stories/headstones/l_george_dan_grave.jpg" rel="rokbox[400 249]" title="Dan George's grave at Burrard Cemetery in North Vancouver.  Photo by Ron Buchinski">
	<img src="/images/stories/headstones/m_george_dan_grave.jpg" alt="Dan George's gave">


					      <div class="clear"><span title="div .clear 63" class="webdeveloper-display-div-order">div .clear 63</span></div>
   </div>
         <!-- EOF headstoneimage block -->

Please Log in or Create an account to join the conversation.

piperchick
Topic Author
Offline
Premium Member

13 years 8 months ago #10083 by piperchick

Replied by piperchick on topic Padding on images inexplicably larger on bottom

Thanks for your reply.

About modifying the CSS, I have tried to modify it there with no luck. I think that there is something going on with the image title. I have attached a screen shot of an element that I inspected with Fire Bug. It seems there is an element that is behind and a bit below the image. This happens with all images, not just the ones in this template (headstones).

As for the weird code... that is proof that I don't know what I am doing. I tried to make a template by copying from other templates. I don't know why the spans are there or how to fix them. I found a tutorial on FLEXI templating ( blog.netassopro.com/en/tutoriel- ... structure/ ) and hope to break down what I want to do.

Lovin' FLEXIcontent at deadcanadians.ca
Dead Canadians: where are they now?

Attachments:

Please Log in or Create an account to join the conversation.

kenmcd
Offline
Moderator

13 years 8 months ago #10084 by kenmcd

Replied by kenmcd on topic Padding on images inexplicably larger on bottom

.
Appears to be a browser quirk as it only appears in Firefox.

The good news . . .
In the page HTML code I deleted all the extra tab characters in the <a> tag and the space disappeared.

The bad news . . .
Have to find where those extra tab characters are in the FLEXIcontent source code and delete them.

.

AllMedia4Joomla Project
Download AllMedia YouTube Feed Gallery module

Please Log in or Create an account to join the conversation.