Solved

Bootstrap - header image

Posted on 2014-02-20
3
436 Views
Last Modified: 2014-02-20
Live site is here
http://www.wiplastic.com/

Beta Bootstrap site here
http://nsitedesigns.com/nsitedesigns/wiplastic_scott/index.html

1.  How do I fix state icon so it floats off page like live site?
2.  Is there a more comparable font that I can use which is responsive?
0
Comment
Question by:nsitedesigns
3 Comments
 
LVL 58

Accepted Solution

by:
Gary earned 250 total points
Comment Utility
The two pages are built differently - the live site is an image of everything.

On the new site add a new div just before your "header row" class div.

and give it this css
   background: #000;
    height: 30px;
    margin: 0 -15px;


And add this class to your css file
.logoimg > img {
    margin-top: -20px;
}

Tweak as necessary
0
 
LVL 51

Assisted Solution

by:Julian Hansen
Julian Hansen earned 250 total points
Comment Utility
An alternative to the above is to give the container a background of black and a top padding of say 50px; then add a negative margin to the image.
<div class="container" style="background: black; padding-top: 50px;">
    <div class="header row">
      <div class="col-xs-4 col-sm-2 logoimg">
            <img src="img/wisc.png" style="margin-top: -40px;">
 ...

Open in new window

0
 

Author Closing Comment

by:nsitedesigns
Comment Utility
yeah!  it worked!
0

Featured Post

Do You Know the 4 Main Threat Actor Types?

Do you know the main threat actor types? Most attackers fall into one of four categories, each with their own favored tactics, techniques, and procedures.

Join & Write a Comment

Suggested Solutions

So you have coded your own WordPress plugin and now you want to allow users to upload images to a folder in the plugin folder rather than the default media location? Follow along and this article will show you how to do just that!
SASS allows you to treat your CSS code in a more OOP way. Let's have a look on how you can structure your code in order for it to be easily maintained and reused.
In this tutorial viewers will learn how to customize the background color and font color of highlighted text using the ::selection element in CSS Begin by defining the selected text as an element in CSS by typing "::selection": Style the ::selection…
The viewer will learn how to create and use a small PHP class to apply a watermark to an image. This video shows the viewer the setup for the PHP watermark as well as important coding language. Continue to Part 2 to learn the core code used in creat…

771 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

Need Help in Real-Time?

Connect with top rated Experts

11 Experts available now in Live!

Get 1:1 Help Now