Want to win a PS4? Go Premium and enter to win our High-Tech Treats giveaway. Enter to Win


Fluid with logo over another image

Posted on 2012-12-20
Medium Priority
Last Modified: 2013-01-29
I'll be placing an image where the header currently is here and wanted the logo to still be positioned absolutely over it where it is now to the left, but to reduce with height:auto at fluid widths.

How would be the best way to do it? Do I need to give the image container a % width?  The middle banner is fluid, but for some reason I can't get the logo to reduce fluidly..

If someone could maybe check in an inspector? Any help appreciated.
Question by:UName10
Welcome to Experts Exchange

Add your voice to the tech community where 5M+ people just like you are talking about what matters.

  • Help others & share knowledge
  • Earn cash & points
  • Learn & ask questions
  • 4
  • 2
LVL 53

Expert Comment

ID: 38711327
You might want to start by validating the code and correcting the errors.  Several of the errors are serious including a duplicate id declaration and an unclosed tag.


Author Comment

ID: 38757042
Sorry for the late reply and thanks for the comment.

Could you point me to them?
LVL 53

Expert Comment

ID: 38759984
Go to http://validator.w3.org/ to validate the HTML, then run the CSS through the validator at http://jigsaw.w3.org/css-validator/

Once the error are corrected, the problems will become manageable, or may be gone.  With correct code we will be able to apply whatever properties we need to correct anything that is still wrong.

Concerto Cloud for Software Providers & ISVs

Can Concerto Cloud Services help you focus on evolving your application offerings, while delivering the best cloud experience to your customers? From DevOps to revenue models and customer support, the answer is yes!

Learn how Concerto can help you.


Author Comment

ID: 38813997
Hi there,

Sorry for the delay; managed to fix it and yeah there were quite a few - I save the test template instead which was messy code, thanks for pointing it out.

I've actually changed it now so it's redundant, but thank you for taking the time to have a look, much appreciated.

Accepted Solution

UName10 earned 0 total points
ID: 38814002
Oh but the way to do it just make the logo width a percentage based on the parent div as normal, and set the height to auto again.  I hasn't set the width which is why it didn't work.

Author Closing Comment

ID: 38830283
It works.

Featured Post

[Webinar] Lessons on Recovering from Petya

Skyport is working hard to help customers recover from recent attacks, like the Petya worm. This work has brought to light some important lessons. New malware attacks like this can take down your entire environment. Learn from others mistakes on how to prevent Petya like worms.

Question has a verified solution.

If you are experiencing a similar issue, please ask a related question

Building a website can seem like a daunting task to the uninitiated but it really only requires knowledge of two basic languages: HTML and CSS.
Today, the web development industry is booming, and many people consider it to be their vocation. The question you may be asking yourself is – how do I become a web developer?
In this tutorial viewers will learn how to code links for mobile sites that, once clicked, send a call or text to a specified number. For a telephone link (once clicked, calls a number), begin with a normal "<a href=" link tag. For the href, specify…
In this tutorial viewers will learn how to style rounded corners for elements in CSS using the border-radius property Begin with a normal styled element such as a div: To style all four corners of the div to be the same degree of roundness, use the …

604 members asked questions and received personalized solutions in the past 7 days.

Join the community of 500,000 technology professionals and ask your questions.

Join & Ask a Question