This code isn’t pulling part to the right?.. Why?..
<ul class="pull-left">
<li>
<a href = "index.html">
<div class="logo">
<img src="http://i.imgur.com/VHMMHWa.png" height="75" width ="150">
</div>
</a>
</li>
</ul>
<ul class="pull-right">
text
</ul>
i put your code in a bin, unable to reproduce problem, can you provide more of your code?
Also, text inside a unordered (and ordered) list should always be in list tags (<li></li>
)
Here’s all of it;
<html>
<head>
<link href="http://s3.amazonaws.com/codecademy-content/courses/ltp/css/shift.css" rel="stylesheet">
<link rel="stylesheet" href="http://s3.amazonaws.com/codecademy-content/courses/ltp/css/bootstrap.css">
<link rel="stylesheet" href="main.css">
<title>
Soccer Academy | Home
<!-- Title visible at the top of the page... -->
</title>
</head>
<body>
<div class="navigationBar">
<ul class="pull-left">
<li>
<a href = "index.html">
<div class="logo">
<img src="http://i.imgur.com/VHMMHWa.png" height="75" width ="150">
</div>
</a>
</li>
</ul>
<ul class="pull-right">
text
</ul>
</div>
</body>
.navigationBar ul {
background-color: white;
}
.navigationBar a {
color: #393D60;
font-size: 15px;
font-weight: normal;
text-transform: uppercase;
}
.navigationBar li {
display: inline;
}
.navigationBar {
position: relative;
}
.shadow {
box-shadow: 0 2px 4px -1px orange;
}
a:hover {
text-decoration: none;
}
a {
text-decoration: none;
}
.logo img {
margin-top: 5px;
}
.profile {
margin-left: 500px;
margin-top: 100
}
so i again put your code in a bin, you can find it here. too me it looks like it is pulling to the right, i want to help, but if i am unable to reproduce the error, that is going to be very hard.
https://jsfiddle.net/n49fr9Lp/ - So you can have it float: left; beside the logo or underneath the logo https://jsfiddle.net/n49fr9Lp/1/ not sure which one you wanted
jsfiddle does only support external javascript library’s, the link to bootstrap is simply not working, jsfiddle blocks it. Try codepen or jsbin