CODEWITHSUNDEEP
htmlcsstwitter-bootstrap
Mikkel
Mikkel

Reputation: 1811

Move icon up and inline with my main heading

I'm trying to move around with my main icon in the top, which is placed in the navbar. I'm using bootstrap and a normal css file called "Site.css"

In my masterpage i i'm getting the files down by these:

<link href="Content/Site.css" rel="stylesheet" />
<link href="Content/bootstrap.css" rel="stylesheet" />

Some code:

<div class="navbar-header">
                <a class="navbar-brand" runat="server" href="~/default.aspx">M-Hotels&nbsp;
                <div class="IconFront">
                    <asp:Image class="img1" ID="Image1" runat="server" Height="28px" ImageUrl="~/Icon.png" Width="30px" ImageAlign="Right" />
                </div>
                </a>
            </div>

Well, right now the icon is inline with the heading. I just want to move the icon up a little, but can't seem too do it.

Have tried with the CSS in the Site.css file:

IconFront {
position:absolute; 
}

img1 {
position:relative; 
top:10px; 
left:0px; 
}

But with this, nothing is happening.. it just wont move :(

Upvotes: 1

Views: 8116

Answers (1)

m4n0
m4n0

Reputation: 32285

You are accessing the class with wrong selector syntax. Add a dot to the selector.

.IconFront {
  position:absolute; 
}

.img1 {
  position:relative; 
  top:10px; 
  left:0px; 
}

Upvotes: 3

Related Questions