css and html positioning of an image element

I am building a site here.  http://162.211.82.64/~ledgers/ Simple html and css.   I have placed the logo to the left of the LEDGERS4u title.  However, I have used absolute positioning so it moves around from device to device.  How do I position this properly with css and html so it stays to the left of the LEDGERS  and I make it all add up title?
livewirewebsolutionsAsked:
Who is Participating?

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

x
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.

GaryCommented:
Move <div class="logo-white"></div> just after the opening H1
Amend the margin and left like so
   left: 0;
    margin: -50px 0;


Tweak as required.
0
livewirewebsolutionsAuthor Commented:
like so? see now.
0
GaryCommented:
No, that's not working
Move it to just before the Ledgers 4u span.

Remove position and left from the .logo-white {} css
Add display:inline-block;
Change the margin to
margin: -60px 0;

You will have to hide it at smaller screens as there is no room for it.
0

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
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!

livewirewebsolutionsAuthor Commented:
mmmmm.  Why is it not working.  It seems to be working perfectly here on a 13" mac and a 19" pc??
0
GaryCommented:
Not once you go down to smaller screen sizes (800px).
0
livewirewebsolutionsAuthor Commented:
ok.  I have made the changes.  How do i remove when a mobile device is browsing the site?
0
GaryCommented:
Add to the css

@media only screen and (max-width: 767px) {
.logo-white {
display:none
}
}

Open in new window

0
livewirewebsolutionsAuthor Commented:
got it.  awesome thanks!
0
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
CSS

From novice to tech pro — start learning today.