Yeah I know my question is probably very confusing but just hear me out. Basically I have a test website with a login system that logs you in with the Steam API. My login button is styled on a separate CSS file than my index.php CSS file. Basically, I can't move the login button onto the top header because they are separate files. Any help would be appreciated.
是的，我知道我的问题可能很混乱，但只是听我说。基本上我有一个测试网站，其中包含一个登录系统，可以使用Steam API登录。我的登录按钮是在一个单独的CSS文件上设置的，而不是我的index.php CSS文件。基本上，我无法将登录按钮移动到顶部标题，因为它们是单独的文件。任何帮助，将不胜感激。
Website (If You Want To See What I'm Talking About.) http://abyssallogin.hol.es
网站（如果你想看看我在说什么。）http://abyssallogin.hol.es
EDIT: (I just want to move the button from where it is now up ontop of the header to the right of the navigation choices.)
编辑:(我只想将按钮从现在位于导航选项右侧的标题上移动。）
Index.php
的index.php
<?php
require 'steamauth/steamauth.php';
?>
<DOCTYPE html>
<html lang="en">
<head>
<meta charset="utf-8">
<title>SteamLoginTest</title>
<link rel="stylesheet" type="text/css" href="css/index.css">
<link rel="stylesheet" href="https://fonts.googleapis.com/css?family=Open+Sans">
</head>
<body>
<? if(!isset($_SESSION['steamid'])) { ?>
<nav class="navigation">
<div class="navigation-logo">Website</div>
<ul>
<li><a href="#" class="navigation-item">Home</a></li>
<li><a href="#" class="navigation-item">Deposit</a></li>
<li><a href="#" class="navigation-item">Withdraw</a></li>
<li><a href="#" class="navigation-item">Free Coins</a></li>
<li><a href="#" class="navigation-item">Support</a></li>
</ul>
<? loginbutton(); ?>
</nav>
<span class="login-message">You are not currently logged in.</span>
<? } else { ?>
<nav class="navigation">
<div class="navigation-logo">Website</div>
<ul>
<li><a href="#" class="navigation-item">Home</a></li>
<li><a href="#" class="navigation-item">Deposit</a></li>
<li><a href="#" class="navigation-item">Withdraw</a></li>
<li><a href="#" class="navigation-item">Free Coins</a></li>
<li><a href="#" class="navigation-item">Support</a></li>
</ul>
<? logoutbutton(); ?>
</nav>
<span class="login-message">You are now logged in.</span>
<? include ('steamauth/userInfo.php'); ?>
<? } ?>
</body>
</html>
Index.css
Index.css
body {
margin: 0px;
padding: 0px;
font-family: 1em 'Open Sans', sans-serif;
}
.navigation {
width: 100%;
height: 70px;
color: rgb(255, 255, 255);
background-color: rgb(40, 40, 40);
}
.navigation > .navigation-logo {
float: left;
height: 40px;
font-size: 1.5em;
line-height: 35px;
padding: 15px 30px;
}
.navigation > ul {
margin: 0px;
float: right;
padding: 0px;
margin-right: 400px;
list-style-type: none;
}
.navigation > ul > li {
float: left;
}
.navigation > ul > li > .navigation-item {
height: 40px;
line-height: 40px;
padding: 15px 20px;
display: inline-block;
text-decoration: none;
color: rgb(255, 255, 255);
}
.login-message {
color: rgb(0, 0, 0);
}
Steamauth.php
Steamauth.php
<?php
ob_start();
session_start();
function logoutbutton() {
echo "<form id='button' action='' method='get'><button class='btn red' name='logout' type='submit'>Logout</button></form>";
}
function loginbutton() {
echo "<form id='button' action='' method='get'><button class='btn red' name='login' type='submit'>Login</button></form>";
}
if (isset($_GET['login'])){
require 'openid.php';
try {
require 'SteamConfig.php';
$openid = new LightOpenID($steamauth['domainname']);
if(!$openid->mode) {
$openid->identity = 'http://steamcommunity.com/openid';
header('Location: ' . $openid->authUrl());
} elseif ($openid->mode == 'cancel') {
echo 'User has canceled authentication!';
} else {
if($openid->validate()) {
$id = $openid->identity;
$ptn = "/^http:\/\/steamcommunity\.com\/openid\/id\/(7[0-9]{15,25}+)$/";
preg_match($ptn, $id, $matches);
$_SESSION['steamid'] = $matches[1];
if (!headers_sent()) {
header('Location: '.$steamauth['loginpage']);
exit;
} else {
?>
<script type="text/javascript">
window.location.href="<?=$steamauth['loginpage']?>";
</script>
<noscript>
<meta http-equiv="refresh" content="0;url=<?=$steamauth['loginpage']?>" />
</noscript>
<?php
exit;
}
} else {
echo "User is not logged in.\n";
}
}
} catch(ErrorException $e) {
echo $e->getMessage();
}
}
if (isset($_GET['logout'])){
require 'SteamConfig.php';
session_unset();
session_destroy();
header('Location: '.$steamauth['logoutpage']);
exit;
}
if (isset($_GET['update'])){
unset($_SESSION['steam_uptodate']);
require 'userInfo.php';
header('Location: '.$_SERVER['PHP_SELF']);
exit;
}
?>
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="utf-8">
<title>SteamLoginTest</title>
<link rel="stylesheet" type="text/css" href="../css/steamauth.css">
<link href="https://fonts.googleapis.com/css?family=Open+Sans" rel="stylesheet">
</head>
<body id="steamauth">
</body>
</html>
Steamauth.css
Steamauth.css
body {
font-family: 'Open Sans', sans-serif;
}
#button {
float: right;
margin-left: 1500px;
}
.btn {
float: right;
border: none;
margin: 20px;
outline: none;
cursor: pointer;
font-size: 22px;
padding: 5px 35px;
border-radius: 5px;
position: relative;
display: inline-block;
text-decoration: none;
color: rgb(255, 255, 255);
}
.btn:active {
box-shadow: 0px 1px 0px 0px;
transform: translate(0px, 5px);
-webkit-transform: translate(0px, 5px);
}
.red {
background-color: rgb(231, 76, 60);
box-shadow: 0px 5px 0px 0px rgb(206, 51, 25);
}
.red:hover {
background-color: rgb(255, 102, 86);
}
1 个解决方案
#1
1
Add these css:
添加这些css：
.navigation > ul
{
margin-right: 165px;
}
#button
{
postion: absolute;
right: 0;
top: 0;
}
#1
1
Add these css:
添加这些css：
.navigation > ul
{
margin-right: 165px;
}
#button
{
postion: absolute;
right: 0;
top: 0;
}