JSFiddle - React, Tailwind, and code Playground

HTML

<div id="top_line"></div>
<div id="top_panel">
	<div id="open_btn">
    	<img id="down" src="img/down.gif" />
    </div>
    
    <div id="profile_pic">
    	<img id="profile_pic" src="img/profile_pic.jpg" />
    </div>
    
    <div id="notifications">-->
    	<p id="notification_text">7</p>
    </div>
    
    <img id="border" src="img/border.gif" />
    
    <div id="settings">
    	<img id="settings_ico" src="img/settings.gif" />
    </div>
    
    <div id="search">
    	<img id="search_ico" src="img/search.gif" />
    </div>   
</div>

<div id="profile_menu"></div>

CSS

#top_line {
	height:4px;
	
	background-color: #e1695b;
	
	position:absolute;
	top:0;
	left:0;
	right:0;
}

#top_panel {
	height: 60px;
	
	background-color: #fcfcfb;
	
	position:absolute;
	top:4px;
	left:0;
	right:0;
}

#open_btn {
	height:25px;
	width:25px;

	position:absolute;
	top:15px;
	
	border-radius: 50%;
	border: 1px solid #999;
	cursor:pointer;
}

#down {
	height:14px;
	width:14px;
	
	position:relative;
	top:6.5px;
	right:-5.7px;
}

#profile_pic {
	height:40px;
	width:40px;
	
	border-radius:50%;
	
	position:absolute;
	top:5px;
	
	cursor:pointer;
}

#notifications {
	height:25px;
	width:25px;
	
	background-color: #dd5c4e;
	position:absolute;
	top:15px;
	
	border-radius: 50%;
	border: 1px solid #999;
	cursor:pointer;
}

#notification_text {
	font-size:18px;
	font-weight: bold;
	color: #ffffff;
	
	position:relative;
	top: -16px;
	left:8px;
}

#border {
	height:50px;
	
	position:absolute;
	top:5px;
}

#settings {
	height:25px;
	width:25px;
	
	background-color: #fcfcfb;
	position:absolute;
	top:15px;
	
	border-radius: 50%;
	border: 1px solid #999;
	cursor:pointer;
}

#settings_ico {
	height:18px;
	width:18px;
	
	position:relative;
	top:3.1px;
	left:3.5px;
}

#search {
	height:25px;
	width:25px;
	
	background-color: #fcfcfb;
	position:absolute;
	top:15px;
	
	border-radius: 50%;
	border: 1px solid #999;
	cursor:pointer;
}

#search_ico {
	height:18px;
	width:18px;
	
	position:relative;
	top:3.1px;
	left:3.5px;
}


#profile_menu {
	height:160px;
	width:240px;
	
	background-color: #0F0;
	
	position:relative;
	top:100px;
	left:100px;
}

JavaScript

var width = document.width;

$('#top_line').css({
	'width' : 'width'
});

$('#top_panel').css({
	'width' : width
});

$('#open_btn').css({
	'right' : width / 12
});

$('#profile_pic').css({
	'right' : width / 9.8
});

$('#notifications').css({
	'right' : width / 7.8
});

$('#border').css({
	'right' : width / 6.5
});

$('#settings').css({
	'right' : width / 6
});

$('#search').css({
	'right' : width / 5.4
});