floats giving me problem i think


Would be grateful for any advice.


this looks fine in both ie and ff but when its viewed on the latest android
the masterhead area is all falling apart.

this is the masterhead

    <div class="masthead" >
      <div style="padding-top: 12px; ">
        <div style="float:left; width:460px; padding-top:30px;
            <h1>Blasting Shot London</h1>
          <div style="font-size:12px;  text-shadow: 2px 2px 3px
#e5e5e5;">Shot Blasting Grit using Shot Blasting Machines by the Shot
Blasting Company</div>
        <div style="float:left; width:420px;"> <img
src="css/img/sandblasting/call-shot-blasting.png" alt="Shot Blasting London"
title="Sand Blasting London" style=" margin-left:240px;" /> </div>

i believe it could be the  float that is causing my misery. can anyone
advise how to correct this...

Who is Participating?

[Product update] Infrastructure Analysis Tool is now available with Business Accounts.Learn More

I wear a lot of hats...

"The solutions and answers provided on Experts Exchange have been extremely helpful to me over the last few years. I wear a lot of hats - Developer, Database Administrator, Help Desk, etc., so I know a lot of things but not a lot about one thing. Experts Exchange gives me answers from people who do know a lot about one thing, in a easy to use platform." -Todd S.

Are you using any type of responsive CSS or media queries?
dizzynonoAuthor Commented:
what do you mean by responsive CSS or media queries
That kind of answered my question.  

For mobile devices and tablets(or different screen resolutions) you really should be using media queries in order to style your site according to the browser resolution.

Take a look here:

Resize your browser and watch how the site responds to the different resolution.
Determine the Perfect Price for Your IT Services

Do you wonder if your IT business is truly profitable or if you should raise your prices? Learn how to calculate your overhead burden with our free interactive tool and use it to determine the right price for your IT services. Download your free eBook now!

dizzynonoAuthor Commented:
ok but i am aware that it is the floats causing the problem. as i can do with out it and it is fine. but i want the content that is inside the masterhead as is.
It may not necessarily be the floats.  Floats will expand to the width of the parent unless otherwise specified, like you have here.

Try playing with the widths of the 2 divs inside masterhead
dizzynonoAuthor Commented:
Floats will expand to the width of the parent unless otherwise specified, like you have here.

of course but i need to divs to be inside the parent thus set a width for each.
Did you try reducing the widths?

Experts Exchange Solution brought to you by

Your issues matter to us.

Facing a tech roadblock? Get the help and guidance you need from experienced professionals who care. Ask your question anytime, anywhere, with no hassle.

Start your 7-day free trial
dizzynonoAuthor Commented:
It was many different problems, sorry to get back so late to you. any way i will just rebuild the page again from scratch. sometimes that is easier lol
It's more than this solution.Get answers and train to solve all your tech problems - anytime, anywhere.Try it for free Edge Out The Competitionfor your dream job with proven skills and certifications.Get started today Stand Outas the employee with proven skills.Start learning today for free Move Your Career Forwardwith certification training in the latest technologies.Start your trial today
Web Development

From novice to tech pro — start learning today.