I am working on a mobile website project and I am in need of a fixed navigation bar that has a specific look...
Unfortunately, my attempts at using fixed positioning to achieve this have not been successful. Instead of getting the desired result, all the elements collapse on top of each other towards the left side of the screen. I even tried clearing the float property after each image but that did not work either. How can I make this navigation bar function correctly? I understand that inline styling in the HTML document is not ideal practice, and I plan to move these styles into separate stylesheets once I have resolved this issue.
echo "<div style='text-align:center;background-color:#FFFFFF;position:fixed;'>".
"<img style='float:left;' id='showLeft' src='slideBtn.png' />".
"<img src='assets/ladle_bnr_mini.png' />".
"<img style='float:right;' src='homeBtn.png' />".
"</div>";