Sat, 2015-05-30 02:35
header.inc.php
<!DOCTYPE html> <html lang="en-US"> <head> <!--Meta Tags--> <meta http-equiv="Content-Type" content="text/html"; charset="utf-8"/> <meta name="viewpoint" content="width=device-width, initial-scale=1, maximum-scale=1, user-scalable=0"/> <title>hello world</title> <link rel = "stylesheet" href="http://maxcdn.bootstrapcdn.com/bootstrap/3.3.4/css/bootstrap.min.css"/> <link rel = "stylesheet" type="text/css" href="style.css"/> <script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.1/jquery.min.js"></script> <script src="http://maxcdn.bootstrapcdn.com/bootstrap/3.3.4/js/bootstrap.min.js"></script> </head> <body> <div id="top_nav"> <a href="index.php"> <img src ="logo.png" alt="logo" width="300px" /> </a> <div class="left_nav"> //Question 1: as you all can see, these are text hyperlinks. I want them to stick on the right hand side of the screen all the time even i rescale the screen, how can i achieve this? <a href="1.php"> 1 </a> <a href="2.php"> 1 </a> <a href="3.php"> 3 </a> </div> </div> style.css #top_nav {height: 150px; width: 100%; background-color: black; position: fixed; //Question 2: i want the top elements on the page to stay away from the fixed position navigation bar? how can i achieve this? display: inline-block; padding-top: 10px; padding-left: 20%; text-decoration: none; } .left_nav {text-align: right; position: fixed; } a {color:white; font: italic bold 20px Georgia, serif; margin-right: 30px; } a:hover {color:red; font: italic bold 20px Georgia, serif; text-decoration: none; margin-right: 30px; } body {background-color: black; margin: 0; padding: 0; } index.php <?php include 'header.inc.php'; ?> <h1>why us?</h1> <p title ="introduction"> blah blah blah</p> </body> </html>
That's all I can think about at the moment. I will see what answer I can get.
