SitePoint Sponsor

User Tag List

Results 1 to 8 of 8
  1. #1
    SitePoint Evangelist Worldbuilder's Avatar
    Join Date
    Jan 2004
    Location
    Boston, MA
    Posts
    481
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)

    Joomla Module Encroaching!

    Hi all,

    http://joomlatest.chrisbartlett.net/

    See the "Yahoo! Weather" area on the left? I'm trying to figure out why it is encroaching on the main content area. The CSS specific to this module is:
    Code:
    .weather_sp1{padding:5px}
    
    .weather_sp1_c{margin:0 0 10px}
    
    .weather_sp1_cleft{float:left}
    
    p.spw_current_temp{font-size:18px;margin:-30px 0 0 15px}
    
    .weather_sp1_cright{float:left;margin:0 0 0 -44px}
    
    p.weather_sp1_city{font-size:24px;line-height:24px;font-weight:700;margin:15px 0 0;padding:0}
    
    .block_even,.block_odd{text-align:center}
    
    span.weather_sp1_temp,span.weather_sp1_list_temp{font-size:10px}
    
    .list_even,.list_odd{width:100%;border-top:1px dashed #e0e0e0}
    
    span.weather_sp1_list_day,span.weather_sp1_list_temp,span.weather_sp1_list_icon{height:32px;line-height:32px;display:block;float:left;width:33%}
    
    img.spw_icon_big{height:96px}
    
    img.spw_icon{height:32px}
    ...Although there may be built-in Joomla CSS also involved.

    I've tried a few things to no avail. This one's beyond me. Can anyone help, please?

    Thanks!

    Chris

  2. #2
    SitePoint Evangelist Worldbuilder's Avatar
    Join Date
    Jan 2004
    Location
    Boston, MA
    Posts
    481
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    OK, I fixed the:

    Lowell, MA
    Cloudy
    Wind: S at 6 mph

    ... being too far left. It was the -44px margin causing that problem.

    Now, I'd like to center the upper icon (currently cloudy) and temperature. Help?

    Thanks!
    Last edited by Worldbuilder; Oct 31, 2012 at 17:17. Reason: Figured part of it out...

  3. #3
    It's all Geek to me silver trophybronze trophy
    ralph.m's Avatar
    Join Date
    Mar 2009
    Location
    Melbourne, AU
    Posts
    24,168
    Mentioned
    454 Post(s)
    Tagged
    8 Thread(s)
    Try this in your CSS:

    Code:
    .weather_sp1_cleft {
      float: none !important;
      text-align: center;
    }
    Then you'll just have to center the cloud in the image itself.

  4. #4
    SitePoint Evangelist Worldbuilder's Avatar
    Join Date
    Jan 2004
    Location
    Boston, MA
    Posts
    481
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    Center the cloud in the image itself???

    AH! I just realized that the cloud itself isn't centered. Good catch!

    Well, nothing I can do about that, unfortunately as the image gets pulled via script from Yahoo.

    OK, gonna have to rethink this.

  5. #5
    It's all Geek to me silver trophybronze trophy
    ralph.m's Avatar
    Join Date
    Mar 2009
    Location
    Melbourne, AU
    Posts
    24,168
    Mentioned
    454 Post(s)
    Tagged
    8 Thread(s)
    If it's always going to be the same cloud image, or if all images have the same size and off-center nature, you could move them a bit further right ... but it sounds a bit messy.

  6. #6
    SitePoint Evangelist Worldbuilder's Avatar
    Join Date
    Jan 2004
    Location
    Boston, MA
    Posts
    481
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    Indeed. I suspect that all the images will have the same issue. The only thing I can think of is to find all those images on Yahoo somewhere, save them locally on my server, fix them, and rewrite the script to fetch my images.

    But seeing as how a programmer/developer I am not, that probably won't fly, either. LOL!

  7. #7
    It's all Geek to me silver trophybronze trophy
    ralph.m's Avatar
    Join Date
    Mar 2009
    Location
    Melbourne, AU
    Posts
    24,168
    Mentioned
    454 Post(s)
    Tagged
    8 Thread(s)
    If the images all have about the same empty space on the right, you could try something like this:

    Code:
    .weather_sp1_cleft {
      float: none !important;
      text-align: center;
    }
    
    .weather_sp1_cleft img.spw_icon_big {
      margin-right:-60px;
    }

  8. #8
    SitePoint Evangelist Worldbuilder's Avatar
    Join Date
    Jan 2004
    Location
    Boston, MA
    Posts
    481
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    That's pretty good, yeah!

    The only thing is that I'll just have to wait until the script gras other images. No way i can force that. So I'll watch it for a week or so and see how it holds up.

    Very cool.


Bookmarks

Posting Permissions

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