Float placement, not in the right position [closed] - html

Question

Closed. This question needs details or clarity. It is not currently accepting answers.
Want to improve this question? Add details and clarify the problem by editing this post.
Closed 7 years ago.
Improve this question
i have my main "watchlisten" div, with everything you see so far inside, but for some apparent reason, i am unable to float my video image on the right side of my left arrow image, i have this as the code for CSS and HTML, i apologize for not having the images available for you to see them, but i want to float Video_1.jpg on the right of Left_watchlisten.jpg.
HTML for the whole watchlisten DIV
<div id="watchlisten">
<img src="Images/boxes.png" class="imageBoxes" />
<h2>Watch/Listen</h2>
<img src="Images/Left_Watchlisten.jpg" class="leftarrow"/>
<div class="wlblock">
<img src="Images/Video_1.jpg" height="75"/>
<p>action to cut leve crossing deaths</p>
</div>
</div>
CSS code for all the classes/id's/h2.
#watchlisten {
background-color: #EEEEEE;
float: right;
width: 380px;
position: relative;
top: -80px;
}
h2 {
color: #505050;
margin: 10px 0 10px 10px;
font-size: 1.8em;
}
.imageBoxes {
float: right;
max-height: 20px;
max-width: 100%;
margin: 12px 10px 0 0;
}
.leftArrow {
float: left !important;
border-right: 1px solid white;
}
.wlblock {
float: left;
}
i hope someone can help, i am a little stuck.

Answer 1

There is problem in your class naming
Your CSS code:
.leftArrow {
float: left !important;
border-right: 1px solid white;
}
Your HTML code:
<img src="Images/Left_Watchlisten.jpg" class="leftarrow"/>
Can you see the difference in class name?
Make the leftArrow, leftarrow in css or leftarrow in html to leftArrow.
It will work.