Hello and welcome to our community! Is this your first visit?
Register
Enjoy an ad free experience by logging in. Not a member yet? Register.
Results 1 to 6 of 6

Thread: CSS Images

  1. #1
    New to the CF scene
    Join Date
    Jul 2012
    Posts
    3
    Thanks
    0
    Thanked 0 Times in 0 Posts

    CSS Images

    Currently, my website has tons of images and really that slows my website. I have tried using CSS sprites but failed to comprehend. Here's the CSS code and I wait for your suggestions on how to improve things.

    Code:
    .header_left {
    	background:url(../images/header_left.png) repeat-x 0 0;
    	height:64px;
    	width:51%;
    	position:absolute;
    	left:0;
    }
    .header_right {
    	background:url(../images/header_right.png) repeat-x 0 0;
    	height:64px;
    	width:51%;
    	position:absolute;
    	right:0;
    }
    .new_menu li a.new_active{
    	background:url(../images/menu_newactive_right.png) no-repeat 100% 0%;
    	color:#474747
    }
    .new_menu li a.active span span{
    	background:url(../images/new_menu_active.png) repeat-x 50% 0%;
    }

  • #2
    Regular Coder LearningCoder's Avatar
    Join Date
    Jan 2011
    Location
    The Pleiades
    Posts
    924
    Thanks
    76
    Thanked 29 Times in 29 Posts
    Why not try to scale your images down so it decreases the file size. That's my only possible suggestion. And I don't know if it's a correct solution at that.

    Could always give it a go though. See what happens.

    Regards,

    LC.

  • #3
    New to the CF scene
    Join Date
    Jul 2012
    Posts
    3
    Thanks
    0
    Thanked 0 Times in 0 Posts
    Quote Originally Posted by LearningCoder View Post
    Why not try to scale your images down so it decreases the file size. That's my only possible suggestion. And I don't know if it's a correct solution at that.

    Could always give it a go though. See what happens.

    Regards,

    LC.
    That is already done using techniques like yahoo smush. The individual file sizes is already optimized. But there are many individual files, which is the real issue.

    So many images ( with each around 300 bytes) and thus many requests. I want to lower those number of requests. So any ideas?

  • #4
    Senior Coder
    Join Date
    Aug 2006
    Posts
    1,305
    Thanks
    11
    Thanked 283 Times in 282 Posts
    Are these images things that could be done with CSS or text? It's hard to tell without a link to the page or links to the images. If you can create the visual with CSS, that's always best.

    But if all the images are necessary, then yes sprites are the only solution I'm aware of.

    Dave

  • #5
    New to the CF scene
    Join Date
    Jul 2012
    Posts
    3
    Thanks
    0
    Thanked 0 Times in 0 Posts
    Quote Originally Posted by tracknut View Post
    Are these images things that could be done with CSS or text? It's hard to tell without a link to the page or links to the images. If you can create the visual with CSS, that's always best.

    But if all the images are necessary, then yes sprites are the only solution I'm aware of.

    Dave
    The thing is I am struggling with sprites as well.

    They don't seem to work on those kind of repeated images or round corner images. Based on the css code shown above, I am just unable to get it right. So I need help on CSS Sprites more than anything.

  • #6
    Senior Coder
    Join Date
    Aug 2006
    Posts
    1,305
    Thanks
    11
    Thanked 283 Times in 282 Posts
    I would be doing rounded corners with css at this point, not images. If that's what these are, get rid of them!

    Dave


  •  

    Posting Permissions

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