The Moz Q&A Forum

    • Forum
    • Questions
    • My Q&A
    • Users
    • Ask the Community

    Welcome to the Q&A Forum

    Browse the forum for helpful insights and fresh discussions about all things SEO.

    1. SEO and Digital Marketing Q&A Forum
    2. Categories
    3. Technical SEO Issues
    4. CSS Float Top Left Image not displaying

    CSS Float Top Left Image not displaying

    Technical SEO Issues
    13 3 494
    • Oldest to Newest
    • Newest to Oldest
    • Most Votes
    Reply
    • Reply as question
    Log in to reply
    This topic has been deleted. Only users with topic management privileges can see it.
    • jesse-landry
      jesse-landry last edited by

      Couple things here --

      First off I'm not sure you'll get the best coding advice here on the moz forums.. Although I know there are some people here who are good at it for sure. You may be better off with these types of questions at stackoverflow.com (just a thought)

      Moz will give you awesome marketing/optimization tips though. For example, I might say to you "hey why are your images titled '09-prod.png' that isn't doing anything for your optimization..." Or I might say "oof. No offense but that site kinda gives me a headache. See if you can make it less busy and scale that drop shadow down... Is that comic sans?? no."

      But also to answer your question, my best bet would be that your first product definition in the CSS has a "clear:left" operator assigned to it. That is most likely why it is not displaying. Try removing that.

      Hope this helps!

      JustInsulation 1 Reply Last reply Reply Quote 1
      • Maximise
        Maximise last edited by

        The product 1 image doesn't seem to exist. Are you sure you don't have it cached in some browsers? Follow this link and press F5 to see if it loads - it doesn't for me.

        http://www.just-insulation.com/007-graphics/popular/01-prod.png

        jesse-landry 1 Reply Last reply Reply Quote 2
        • jesse-landry
          jesse-landry @Maximise last edited by

          Ha! Yeah that'll do it. Nicely done Maximise.

          As a side, what does the clear: operator do in CSS?

          1 Reply Last reply Reply Quote 1
          • Maximise
            Maximise last edited by

            Thanks!

            It relates to elements that are floated. Options are left, right, both or none. So if you have "clear:left" then this element can not have any floated elements to it's left and would therefore be bumped to the next line.

            JustInsulation 1 Reply Last reply Reply Quote 1
            • JustInsulation
              JustInsulation @Maximise last edited by

              Hi there Maximise,

              Thank you for the advice. The problem is now solved thanks to the responses to my post.

              It seems, that (following Jesse's critique) when I removed the drop shadows from the images, the situation resolved itself. I can only imagine that the Drop Shadows were effecting the image size, and this impacted upon the CSS Float mechanism.

              Anyway, thanks again.

              1 Reply Last reply Reply Quote 0
              • JustInsulation
                JustInsulation @jesse-landry last edited by

                Greetings Jesse,

                Thanks for the feedback. It seems that once I removed the drop shadows from the images, the situation resolved itself. Clearly there was a sizing issue with one or more of the images that was throwing the CSS float out of kilter.

                The reason that I named the images prod-1, prod-2, prod-3, was to semi-automate future image changes. As these are background images, populated through CSS, rather then HTML, I understood that they had no influence on SEO.

                Sorry about your headache, and 'Yes', you were quite right that the 'Happy Monkey' font was totally over the top! That came about because of my mistake in the CSS Links, and has since been resolved.

                I have been trying to identify a jQuery Gallery or Lightbox to use instead of CSS, but without luck so far.

                Again, my thanks for your critique.

                jesse-landry 1 Reply Last reply Reply Quote 1
                • jesse-landry
                  jesse-landry @JustInsulation last edited by

                  Bravo, sir! May I make one more SEO related quick-suggestion:

                  Make sure you redirect your page with a 301 to avoid duplicate content. Right now you have two addresses (www.domain.com and www.domain.com/index.html) displaying the same content. These will both be indexed and should be redirected.

                  Also from a usability standpoint I feel like the images should be clickable... But there are a ton of these little nit-picky changes I'll leave to you 🙂

                  You might be kind of shooting yourself in the foot with the whole image name thing. You don't have alt tags or image names and that can affect your on-site optimization. However you won't rank for every product on one page anyway so in your case it might not matter terribly. Still I'd raise an eyebrow if it were my page..

                  Anyway good luck!

                  JustInsulation 1 Reply Last reply Reply Quote 1
                  • JustInsulation
                    JustInsulation @jesse-landry last edited by

                    Thanks again for your input, Jesse.

                    Your 301 Redirect has me worried. We presently have the canonical statement on our home page ...  - and thought that this was the correct way to prioritise http://www.just-insulation.com over http://www.just-insulation.com/index.com . Also, the weekly Moz Campaign Crawl Diagnostics is not showing any errors. Can you elaborate on the best method to resolve this issue?

                    I continue to search for an appropriate SEO friendly Add-in that will allow me to frequently change the front page images / hyperlinks / descriptions / etcetera. However, I certainly do take your advice on board.

                    Many thanks.

                    jesse-landry 1 Reply Last reply Reply Quote 0
                    • jesse-landry
                      jesse-landry @JustInsulation last edited by

                      No problem.

                      While it is good you have the canonical tag present, you should still redirect one to the other. The canonical tag will prevent any duplicate content issues with your site so at least you don't have to worry about that. But not redirecting can still have some unwanted effects on your page.

                      Basically it can split your PR/PA between two URLs. If somebody links to yourdomain.com and another somebody links to yourdomain.com/index.html these two links are now receiving juice separately. The canonical tag does not carry link juice. That is why you want to 301 the index.html page to your root domain. Your hosting provider should be able to do this easily for you, or go ahead and google it if you have your own server. (the process changes based on whether you're hosting via Apache servers or IIS servers.)

                      I would still focus on getting that redirected. It'll save you headaches in the future.

                      Good luck!

                      JustInsulation 1 Reply Last reply Reply Quote 1
                      • JustInsulation
                        JustInsulation @jesse-landry last edited by

                        Should I understand that you are proposing that I use the .htaccess file to create a server side redirect?

                        jesse-landry 1 Reply Last reply Reply Quote 0
                        • jesse-landry
                          jesse-landry @JustInsulation last edited by

                          Yes exactly. Assuming you're on an Apache server, of course.

                          Just to clarify, I ran both URLs through Open Site Explorer and sure enough two different Page Authorities returned:

                          www.just-insulation.com has a PA of 32

                          www.just-insulation.com/index.html has a PA of 15

                          Showing that in fact your link juice is splitting there when ideally you will want it combined.

                          JustInsulation 1 Reply Last reply Reply Quote 1
                          • JustInsulation
                            JustInsulation @jesse-landry last edited by

                            G'day Jesse,

                            I have added the following code to my .htaccess file ...

                            RewriteEngine On
                            RewriteCond %{THE_REQUEST} ^[A-Z]{3,9}\ /.index.html\ HTTP/
                            RewriteRule ^(.
                            )index.html$ http://www.just-insulation.com/$1 [R=301,L]

                            All attempts to add a similar code to redirect in the other direction results in the home page not loading, or the creation of an infinite loop.

                            Open Site Explorer still returns ...
                            www.just-insulation.com a PA of 32 and 
                            www.just-insulation.com/index.html a PA of 15

                            The thought of all this lost link juice is making me really thirsty.

                            1 Reply Last reply Reply Quote 0
                            • 1 / 1
                            • First post
                              Last post
                            • Optimizing my images to appear on Google Images
                              Leah777
                              Leah777
                              1
                              18
                              232

                            • Images, CSS and Javascript on subdomain or external website
                              JordanLowry
                              JordanLowry
                              0
                              2
                              1.4k

                            • CSS background image links bad for seo?
                              JimLynch
                              JimLynch
                              0
                              3
                              1.4k

                            • Using Javascript to Display Responsive Images?
                              canterburry
                              canterburry
                              0
                              3
                              110

                            • Image Alt Text: Do I Need to Link my Image for it to Count?
                              seo.owl
                              seo.owl
                              0
                              5
                              488

                            • Consistent top 10 in G image search - but a different 'stolen' version every time!
                              KeriMorgret
                              KeriMorgret
                              0
                              2
                              103

                            • Why are old versions of images still showing for my site in Google Image Search?
                              STPseo
                              STPseo
                              0
                              4
                              2.2k

                            • How to push down outdated images in Google image search
                              jimmartin_zoho.com
                              jimmartin_zoho.com
                              0
                              3
                              1.5k

                            Get started with Moz Pro!

                            Unlock the power of advanced SEO tools and data-driven insights.

                            Start my free trial
                            Products
                            • Moz Pro
                            • Moz Local
                            • Moz API
                            • Moz Data
                            • STAT
                            • Product Updates
                            Moz Solutions
                            • SMB Solutions
                            • Agency Solutions
                            • Enterprise Solutions
                            • Digital Marketers
                            Free SEO Tools
                            • Domain Authority Checker
                            • Link Explorer
                            • Keyword Explorer
                            • Competitive Research
                            • Brand Authority Checker
                            • Local Citation Checker
                            • MozBar Extension
                            • MozCast
                            Resources
                            • Blog
                            • SEO Learning Center
                            • Help Hub
                            • Beginner's Guide to SEO
                            • How-to Guides
                            • Moz Academy
                            • API Docs
                            About Moz
                            • About
                            • Team
                            • Careers
                            • Contact
                            Why Moz
                            • Case Studies
                            • Testimonials
                            Get Involved
                            • Become an Affiliate
                            • MozCon
                            • Webinars
                            • Practical Marketer Series
                            • MozPod
                            Connect with us

                            Contact the Help team

                            Join our newsletter
                            Moz logo
                            © 2021 - 2026 SEOMoz, Inc., a Ziff Davis company. All rights reserved. Moz is a registered trademark of SEOMoz, Inc.
                            • Accessibility
                            • Terms of Use
                            • Privacy