body {
margin: 0;
font-family: arial;
line-height: 16px;
}
#topbar {
background-color: #600c0c;
width: 100%;
height: 46px;
color: white;
margin: 0;
}
.fixedwidth {
width: 1050px;
margin: 0 auto;
}
#logodiv {
padding-top: 5px;
float: left;
border-right: 1px solid #b20505;
padding-right: 10px;
padding-bottom: 4px;
}
#signindiv {
font-weight: bold;
font-size: 0.9em;
border-right: 1px solid #b20505;
padding: 1px 80px 0px 12px;
float: left;
}
#topmenudiv {
float: left;
}
#topmenudiv ul {
padding: 0;
margin: 0px;
}
#topmenudiv li {
list-style: none;
font-weight: bold;
font-size: 0.9em;
border-right: 1px solid #b20505;
height: 100%;
padding: 15px 20px 15px 20px;
float: left;
}
#searchdiv {
float: left;
padding: 5px 0 0 10px;
}
#searchdiv input {
height: 25px;
border: none;
font-size: 0.9em;
padding-left: 10px;
background-image: url(images/Search.png);
background-repeat: no-repeat;
background-position: right center;
}
.break {
clear: both;
}
#newsbar {
background-color: #b20505;
width: 100%;
height: 80px;
color: white;
margin: 0;
}
#newsbar p {
margin: 0;
padding: 0;
padding-top: 30px;
padding-left: 0px;
float: left;
}
#newsheader {
font-size: 3em;
}
#uk {
font-size: 0.7em;
padding-left: 8px;
}
rss {
float: right;
}
<!doctype html>
<html>
<head>
<title>My BBC</title>
<meta charset="utf-8" />
<meta http-equiv="Content-type" content="text/html; charset=utf-8" />
<meta name="viewport" content="width=device-width, initial-scale=1" />
</head>
<body>
<div id="container">
<div id="topbar">
<div class="fixedwidth">
<div id="logodiv">
<img src="images/BBCLogo.png" />
</div>
<div id="signindiv">
<p>Sign In</p>
</div>
<div id="topmenudiv">
<ul>
<li>News</li>
<li>Sport</li>
<li>Weather</li>
<li>iPlayer</li>
<li>TV</li>
<li>Radio</li>
<li>More...</li>
</ul>
</div>
<div id="searchdiv">
<input type="text" placeholder="Search" />
</div>
</div>
</div>
<div class="break"></div>
<div id="newsbar">
<div class="fixedwidth">
<p id="newsheader">NEWS <span id="uk">UK</span>
</p>
<div id="rss">
RSS
</div>
</div>
</div>
</div>
</body>
</html>
I'm attempting to replicate the design of the BBC news website, but I'm facing an issue where the word "RSS" is not floating to the right as intended, despite setting the width for the entire container div. I can't figure out what's causing this discrepancy. Here is how it appears..