Results 1 to 14 of 14
  1. #1
    5 Star Lounger
    Join Date
    Jun 2001
    Location
    USA
    Posts
    708
    Thanks
    48
    Thanked 1 Time in 1 Post

    Help with Blogger

    I'm having trouble with Blogger's "Email This Post" function. http://help.blogger.com/bin/answer.p...r=981&topic=41 was helpful, but as you can see from my blog, the icon now has a border that vertically expands the line on which the icon sits.

    Here's the relevant code from my template:

    <hr><$BlogItemControl$>




    </div>
    <hr>

    How do I remove the unnecessary space, so everything is flush?

    Many thanks!

  2. #2
    Platinum Lounger
    Join Date
    Feb 2002
    Location
    A Magic Forest in Deepest, Darkest Kent
    Posts
    5,681
    Thanks
    0
    Thanked 1 Time in 1 Post

    Re: Help with Blogger

    Hi Jon

    You MUST play with this yourself so that you get the desired effect. The piece of code you must look at is between the style tags and is called
    .post img

    I have change the code as below and this takes away the border you are talking about. You will have to change the bold values yourself but the top and bottom paddin values are your concern for this particular question.

    .post img {
    padding-top: 0px;
    padding-right:4px;
    padding-bottom:0px;
    padding-left:4px:
    border:1px solid #ddd;
    margin-top: 8px;
    }
    Jerry

  3. #3
    5 Star Lounger
    Join Date
    Jun 2001
    Location
    USA
    Posts
    708
    Thanks
    48
    Thanked 1 Time in 1 Post

    Re: Help with Blogger

    Hi Jerry,

    So nice to hear from you. And thank you very much for your response.

    As it happens, I was able to replicate the relevant portion of a template from my other blog, which did the trick. (Plus, it didn't seem like I could change the bold values to a negative.)

    In any event, this has lead to another problem: whereas the e-mail icon is both visible and hyperlinked in Firefox, the icon is invisible and hyperlinked in Internet Explorer.

    Here's the relevant code:

    <hr><$BlogItemControl$>
    <span class="email-post-icon"> </span></p>


    </div>
    <hr>

    Any idea what's causing this? Many thanks!

  4. #4
    Super Moderator jscher2000's Avatar
    Join Date
    Feb 2001
    Location
    Silicon Valley, USA
    Posts
    23,112
    Thanks
    5
    Thanked 93 Times in 89 Posts

    Re: Help with Blogger

    <P ID="edit" class=small>(Edited by jscher2000 on 18-Mar-06 17:10. )</P>Your link contains a space and then an empty <span> element. Why is it empty? Shouldn't something be in there, like an <img> tag? Or do you just want to display a background image associated with the style definition for the email-post-icon class?

    Upon further review, the background-image specified in the stylesheet is on www.blogger.com, not on your domain, so the relative reference fails. Which raises an interesting question: why did it work in Firefox at all?

  5. #5
    5 Star Lounger
    Join Date
    Jun 2001
    Location
    USA
    Posts
    708
    Thanks
    48
    Thanked 1 Time in 1 Post

    Re: Help with Blogger

    Hi Jefferson,

    I didn't create the template I'm using, so I don't know how to answer your first question [img]/forums/images/smilies/smile.gif[/img]

    As for the second question, I'm stumped...

    Thanks.

  6. #6
    Platinum Lounger
    Join Date
    Feb 2002
    Location
    A Magic Forest in Deepest, Darkest Kent
    Posts
    5,681
    Thanks
    0
    Thanked 1 Time in 1 Post

    Re: Help with Blogger

    Hi Jon

    Now I think I have got to the bottom of this and I believe it is a badly designed and tested template. There has been a reasonably well documented problem with IE in versions 5 and in 6 that has problems importing css files.

    To save file length, developers use the @import code that imports a css file from a seperate location and the HTML file reads from this. The template has 2 @import links the one you will be concerned with is the blog_controls.css file which contains the styles for the location of the email image file.(this is what Jefferson was alluding to but the style for that image is in this imported css file)

    Firefox (as usual) reads this @import correctly and collects the file and as you quite rightly note IE doesn't. The best way to work around this problem is to link it and not import it so there will have to be a little change required to your template. As the css file is kept on the blooger server you will not have control of the file and be able to make changes unless you break this link and place the styles in the html file itself.

    You will have to make the following changes:

    Delete bold letters

    <style type="text/css">
    @import url("http://www.blogger.com/css/blog_controls.css");
    @import url("http://www.blogger.com/dyn-css/authorization.css?blogID=20147847");


    </style>


    and replace with

    <link href="http://www.blogger.com/css/blog_controls.css" rel="stylesheet" type="text/css" />

    IMHO --I don't think there is anything you can do about this as the problem sit directly with Blooger.com for a badly designed piece of code and you will probably have to approach them to make the changes but don't hold your breath <img src=/S/grin.gif border=0 alt=grin width=15 height=15>
    Jerry

  7. #7
    5 Star Lounger
    Join Date
    Jun 2001
    Location
    USA
    Posts
    708
    Thanks
    48
    Thanked 1 Time in 1 Post

    Re: Help with Blogger

    Hi Jerry,

    Thanks for your investigative work.

    Unfortunately, my template doesn't seem to contain the text I'm supposed to change. Here's the top of the code:

    <hr><!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">

    <html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en" lang="en">
    <head>
    <title><$BlogPageTitle$></title>

    <$BlogMetaData$>

    <script type="text/javascript" src="http://www.haloscan.com/load/sprachgefuhl"></script>

    <style type="text/css">

    /*
    -----------------------------------------------
    Blogger Template Style
    Name: Minima
    Designer: Douglas Bowman
    URL: www.stopdesign.com
    Date: 26 Feb 2004
    ----------------------------------------------- */<hr>

    Do you know what's wrong? Many thanks.

  8. #8
    Platinum Lounger
    Join Date
    Feb 2002
    Location
    A Magic Forest in Deepest, Darkest Kent
    Posts
    5,681
    Thanks
    0
    Thanked 1 Time in 1 Post

    Re: Help with Blogger

    <img src=/S/hmmn.gif border=0 alt=hmmn width=15 height=15> I assume we are looking at the same piece of code, I have it as line 14 but I must admit I have been playing around with it. Try Ctrl+F (assuming you are using notepad/word or something similar) and do a search for controls.css otherwise I am baffled!
    Jerry

  9. #9
    Super Moderator jscher2000's Avatar
    Join Date
    Feb 2001
    Location
    Silicon Valley, USA
    Posts
    23,112
    Thanks
    5
    Thanked 93 Times in 89 Posts

    Re: Help with Blogger

    Please complain to the Blogger people. The template imports a .css from blogger.com to a page on blogspot.com and IE isn't resolving the relative links in that stylesheet back to blogger.com, with the result that it can't find the image file. I still don't understand why it works in Firefox...

  10. #10
    Platinum Lounger
    Join Date
    Feb 2002
    Location
    A Magic Forest in Deepest, Darkest Kent
    Posts
    5,681
    Thanks
    0
    Thanked 1 Time in 1 Post

    Re: Help with Blogger

    Jeff, I may have misunderstood your point but

    >I still don't understand why it works in Firefox...

    Why shouldn't it, it is totally valid...or am I missing your point <img src=/S/shrug.gif border=0 alt=shrug width=39 height=15>
    Jerry

  11. #11
    Super Moderator jscher2000's Avatar
    Join Date
    Feb 2001
    Location
    Silicon Valley, USA
    Posts
    23,112
    Thanks
    5
    Thanked 93 Times in 89 Posts

    Re: Help with Blogger

    Well, Jon's site is on blogspot.com, and the background-image has a relative path, like /myimages/something.gif -- so I would expect the style definitions you import from the other domain to lose track of the true location of the image. The browser could figure out that the reference probably was meant to point to blogger.com rather than to blogspot.com, because the stylesheet itself lives on blogger.com, but IE does not seem to put 2 and 2 together. Usually it's IE that covers up for developer errors rather than sticking to "standards." So that's why I can't figure out why it works in Firefox and not IE. Unless it's a bug in IE. That has been known to happen. <img src=/S/wink.gif border=0 alt=wink width=15 height=15>

  12. #12
    Platinum Lounger
    Join Date
    Feb 2002
    Location
    A Magic Forest in Deepest, Darkest Kent
    Posts
    5,681
    Thanks
    0
    Thanked 1 Time in 1 Post

    Re: Help with Blogger

    Right, see your point now, well spotted sir <img src=/S/gent.gif border=0 alt=gent width=17 height=25>
    Jerry

  13. #13
    5 Star Lounger
    Join Date
    Jun 2001
    Location
    USA
    Posts
    708
    Thanks
    48
    Thanked 1 Time in 1 Post

    Re: Help with Blogger

    Strange: my template doesn't contain controls.css. See attached, which I simply copied and pasted from Blogger.

    In any event, per Jefferson's most recent post, am I to understand that the absence of the mail icon is simply a bug in IE?

    Thanks a lot.

  14. #14
    Platinum Lounger
    Join Date
    Feb 2002
    Location
    A Magic Forest in Deepest, Darkest Kent
    Posts
    5,681
    Thanks
    0
    Thanked 1 Time in 1 Post

    Re: Help with Blogger

    <img src=/S/hmmn.gif border=0 alt=hmmn width=15 height=15> In your original <post:=564,328>post 564,328</post:> in this thread there is a link to your blog. On selecting that link I viewed the code and in line 14 of that code I saw:

    <style type="text/css">
    @import url("http://www.blogger.com/css/blog_controls.css");
    @import url("http://www.blogger.com/dyn-css/authorization.css?blogID=20147847");
    </style>

    So it is there, but maybe we are looking at different files <img src=/S/shrug.gif border=0 alt=shrug width=39 height=15>

    The problem sits flatly on the laps of Blogger.com due to the referential nature of the links within the code which they will have to fix for you to view this email icon. I have played with this just for the curious nature of the way it has been put together. However much we play with your template we are not going to fix without the intervention of blogger.com to adapt their external css file which we are not to access and change.
    Jerry

Posting Permissions

  • You may not post new threads
  • You may not post replies
  • You may not post attachments
  • You may not edit your posts
  •