Want to protect your cyber security and still get fast solutions? Ask a secure question today.Go Premium

x
  • Status: Solved
  • Priority: Medium
  • Security: Public
  • Views: 399
  • Last Modified:

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?
0
livewirewebsolutions
Asked:
livewirewebsolutions
  • 4
  • 4
1 Solution
 
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
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.

 
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

Featured Post

VIDEO: THE CONCERTO CLOUD FOR HEALTHCARE

Modern healthcare requires a modern cloud. View this brief video to understand how the Concerto Cloud for Healthcare can help your organization.

  • 4
  • 4
Tackle projects and never again get stuck behind a technical roadblock.
Join Now