Help with Bootstrap logo overflow

[Dext3r]

Noob here, I’m trying to achieve something like this

http://i.imgur.com/3WFNg1f.png

Here’s what I came up with:

CSS

.eye {
position: absolute;
background-color: black;
width: 65px;
height: 65px;
top: 0;
left: 17px;
}

.eye svg {
margin: 8px 8px 8px 8px;
fill: white;
}

.navbar-brand {
float: left;
height: 50px;
padding: 15px 50px;
font-size: 18px;
line-height: 20px;
}
Is there another way of doing it? Cause I feel like my way is wrong.

Demo: http://codepen.io/anon/pen/avPgMJ

[Shikkediel]

Is there something not looking as it should or are you asking for general pointers then?

[Dext3r]

Hey thanks for your reply, I just wanted eyes on the code from someone who knows what he or she is doing. I’m really new to all this so I don’t feel like I’m doing anything right.

[Shikkediel]

Hard to write it all down but here’s my take – the more “natural” it’s built, so the less styling necessary, the cleaner it would be. Bootstrap already sets a few styles (you can check with developer tools) so I left these out.

Link

[Author]

Posts