venom2k6
NGBler
- Registriert
- 15 Juli 2013
- Beiträge
- 107
Ich habe mein Problem selbst lösen können, würde allerdings Ressourcen sparen und den Thread gerne für kleine Bootstrap fragen kapern
Eigeninitiative ist mir wichtig, ich will hier niemanden zwingen mir sämtliche codes vorzukauen.... so findet kein Lernprozess statt... Ich versuche immer möglichst alles selbst herauszufinden und frage im grunde nur wenn ich wirklich nicht weiter weis oder keine informationen finde
Ursprünglicher Post
Eigeninitiative ist mir wichtig, ich will hier niemanden zwingen mir sämtliche codes vorzukauen.... so findet kein Lernprozess statt... Ich versuche immer möglichst alles selbst herauszufinden und frage im grunde nur wenn ich wirklich nicht weiter weis oder keine informationen finde
Ursprünglicher Post
Hi,
ich versuche mich gerade mit bootstrap4 einzuarbeiten und will meine testseite sowohl aufn smartphone als auch vernünftig bedienen können. dazu stoße ich aktuell auf ein Problem mit dem Content. Es war von mir dann eigentlich gedacht, das neu gelernte anschließend in ein kleines projekt einzubauen. nun komme ich aber leider nicht weiter...
ich habe das template bereits gesplittet in head.php, footer.php und nav.php
in der index.php werden die dementsprechenden template files reingeladen. funktioniert auch alles soweit so gut.
Index.php
[src=html5]
<!doctype html>
<html lang="en">
<?php include_once('head.php'); ?>
<body class="bg-dark">
<?php include_once('nav.php'); ?>
<?php
$site = array();
$site['dashboard'] = './cts/dashboard.php';
$site['addsw'] = './cts/addsw.php';
$site['addhw'] = './cts/addhw.php';
$site['listsw'] = './cts/listsw.php';
$site['listhw'] = './cts/listhw.php';
// Inhalt Start
if (isset($_GET['site'], $site[$_GET['site']]))
{
include $site[$_GET['site']];
//$_SESSION['sitetitel'] = $_GET['acp'];
} else {
echo '<META HTTP-EQUIV = "Refresh"; CONTENT = "0; URL=index.php?lang=de&site=dashboard">';
}
?>
<?php include_once('footer.php'); ?>
</body>
</html>
[/src]
head.php
[src=html5]
<head>
<meta charset="utf-8">
<meta name="viewport" content="width=device, initial-scale=1, shrink-to-fit=no">
<link rel="icon" href="./img/icon95.png">
<link rel="stylesheet" href="https://stackpath.bootstrapcdn.com/bootstrap/4.3.1/css/bootstrap.min.css" integrity="sha384-ggOyR0iXCbMQv3Xipma34MD+dH/1fQ784/j6cY/iJTQUOhcWr7x9JvoRxT2MZw1T" crossorigin="anonymous">
<link rel="stylesheet" href="./css/custom.css">
<!--<link rel="stylesheet" href="./css/base.css">-->
<title>AMIGO! The Retro Collector</title>
<?php require_once('./support/de.php'); ?>
<!-- jQuery first, then Tether, then Bootstrap JS. -->
<script src="js/jquery-3.3.1.slim.min.js"></script>
<script src="js/popper.min.js"></script>
<script src="js/bootstrap.min.js"></script>
</head>
[/src]
nav.php
[src=html5]
<nav class="navbar navbar-expand-md navbar-dark bg-dark border-bottom border-warning">
<a class="navbar-brand align-middle" href="#">
<img src="./img/logo_square.png" height="70" class="d-inline-block align-top" alt="">
</a><div class=" text-center text-success font-weight-bolder font-italic"><h3>SEITENNAME!</h3>Kleiner SLOGAN</div>
<button class="navbar-toggler" type="button" data-toggle="collapse" data-target="#navbarSupportedContent">
<span class="navbar-toggler-icon"></span>
</button>
<div class="collapse navbar-collapse" id="navbarSupportedContent">
<ul class="navbar-nav mr-auto">
<li class="nav-item active"><a href="index.php?lang=de&site=dashboard" class="nav-link text-warning"><?php echo str_start ?></a></li>
<li class="nav-item"><a href="index.php?lang=de&site=dashboard" class="nav-link text-warning"><?php echo str_cats ?></a></li>
<li class="nav-item dropdown">
<a class="nav-link dropdown-toggle text-warning" href="#" id="navbarDropdown" role="button" data-toggle="dropdown"><?php echo str_collect ?></a>
<div class="dropdown-menu bg-dark border-warning" aria-labelledby="navbarDropdown">
<a class="dropdown-item text-warning" href="index.php?lang=de&site=listhw"><?php echo str_listhw ?></a>
<a class="dropdown-item text-warning" href="index.php?lang=de&site=listsw"><?php echo str_listsw ?></a>
<div class="dropdown-divider"></div>
<a class="dropdown-item text-warning" href="#"><?php echo str_srchhw ?></a>
<a class="dropdown-item text-warning" href="#"><?php echo str_srchsw ?></a>
</div>
</li>
</ul>
</div>
</nav>
[/src]
footer.php
[src=html5]<footer class="fixed-bottom bg-dark text-white mt-4 text-center border-top border-warning">
<div class="container-fluid py-3">
Amigo! The Retro Collector © 2019 Neocrypton
</div>
</footer>[/src]
dashboard.php
[src=html5]<div class="container-fluid text-light ">
<div class="row">
<div class="col rounded-lg bg-secondary ml-1 mr-1 mb-1 mt-2 text-center">
<img src="./img/128/addsw128.png" class="d-inline-block align-top m-2" alt="">
<img src="./img/128/addhw128.png" class="d-inline-block align-top m-2" alt="">
</div>
<div class="col rounded-lg bg-secondary mr-1 ml-0 mb-1 mt-2 text-center">
<img src="./img/128/srchsw128.png" class="d-inline-block align-top m-2" alt="">
<img src="./img/128/srchhw128.png" class="d-inline-block align-top m-2" alt="">
<img src="./img/128/cllctvw128.png" class="d-inline-block align-top m-2" alt="">
</div>
<div class="w-100"></div>
<div class="col rounded-lg bg-secondary ml-1 mr-1 mb-1 mt-0 text-center"></div>
<div class="col rounded-lg bg-secondary ml-0 mr-1 mb-1 mt-0 text-center">Column</div>
<div class="w-100"></div>
<div class="col rounded-lg bg-secondary mr-1 ml-1 mt-2">Column</div>
</div>
</div>[/src]
Ich habe den footer fixiert, da ich gerne immer unten in voller breite haben möchte. das klappte von der optik her super.
den contentinhalt hingegen der sich in der dashboard.php befindet, hätte cih gern scrollbar. das ist aktuell auf der desktop ansicht nicht notwendig, aber am smartphone müsste ich etwas scrollen damit ich den unteren rest dargestellt bekäme... leider krieg ich das grade absolut nicht hin.. ich habe es bereits mit der eigenschaft overflow-auto im DIV-Container der dashboard.php probiert. dies macht mir jedoch leider nicht den content scrollbar wie ursprünglich von mir erwartet :/
ich hoffe es wird in etwa verstanden was ich meine und jemand von euch kann mir helfen. schonmal danke im vorraus
ich versuche mich gerade mit bootstrap4 einzuarbeiten und will meine testseite sowohl aufn smartphone als auch vernünftig bedienen können. dazu stoße ich aktuell auf ein Problem mit dem Content. Es war von mir dann eigentlich gedacht, das neu gelernte anschließend in ein kleines projekt einzubauen. nun komme ich aber leider nicht weiter...
ich habe das template bereits gesplittet in head.php, footer.php und nav.php
in der index.php werden die dementsprechenden template files reingeladen. funktioniert auch alles soweit so gut.
Index.php
[src=html5]
<!doctype html>
<html lang="en">
<?php include_once('head.php'); ?>
<body class="bg-dark">
<?php include_once('nav.php'); ?>
<?php
$site = array();
$site['dashboard'] = './cts/dashboard.php';
$site['addsw'] = './cts/addsw.php';
$site['addhw'] = './cts/addhw.php';
$site['listsw'] = './cts/listsw.php';
$site['listhw'] = './cts/listhw.php';
// Inhalt Start
if (isset($_GET['site'], $site[$_GET['site']]))
{
include $site[$_GET['site']];
//$_SESSION['sitetitel'] = $_GET['acp'];
} else {
echo '<META HTTP-EQUIV = "Refresh"; CONTENT = "0; URL=index.php?lang=de&site=dashboard">';
}
?>
<?php include_once('footer.php'); ?>
</body>
</html>
[/src]
head.php
[src=html5]
<head>
<meta charset="utf-8">
<meta name="viewport" content="width=device, initial-scale=1, shrink-to-fit=no">
<link rel="icon" href="./img/icon95.png">
<link rel="stylesheet" href="https://stackpath.bootstrapcdn.com/bootstrap/4.3.1/css/bootstrap.min.css" integrity="sha384-ggOyR0iXCbMQv3Xipma34MD+dH/1fQ784/j6cY/iJTQUOhcWr7x9JvoRxT2MZw1T" crossorigin="anonymous">
<link rel="stylesheet" href="./css/custom.css">
<!--<link rel="stylesheet" href="./css/base.css">-->
<title>AMIGO! The Retro Collector</title>
<?php require_once('./support/de.php'); ?>
<!-- jQuery first, then Tether, then Bootstrap JS. -->
<script src="js/jquery-3.3.1.slim.min.js"></script>
<script src="js/popper.min.js"></script>
<script src="js/bootstrap.min.js"></script>
</head>
[/src]
nav.php
[src=html5]
<nav class="navbar navbar-expand-md navbar-dark bg-dark border-bottom border-warning">
<a class="navbar-brand align-middle" href="#">
<img src="./img/logo_square.png" height="70" class="d-inline-block align-top" alt="">
</a><div class=" text-center text-success font-weight-bolder font-italic"><h3>SEITENNAME!</h3>Kleiner SLOGAN</div>
<button class="navbar-toggler" type="button" data-toggle="collapse" data-target="#navbarSupportedContent">
<span class="navbar-toggler-icon"></span>
</button>
<div class="collapse navbar-collapse" id="navbarSupportedContent">
<ul class="navbar-nav mr-auto">
<li class="nav-item active"><a href="index.php?lang=de&site=dashboard" class="nav-link text-warning"><?php echo str_start ?></a></li>
<li class="nav-item"><a href="index.php?lang=de&site=dashboard" class="nav-link text-warning"><?php echo str_cats ?></a></li>
<li class="nav-item dropdown">
<a class="nav-link dropdown-toggle text-warning" href="#" id="navbarDropdown" role="button" data-toggle="dropdown"><?php echo str_collect ?></a>
<div class="dropdown-menu bg-dark border-warning" aria-labelledby="navbarDropdown">
<a class="dropdown-item text-warning" href="index.php?lang=de&site=listhw"><?php echo str_listhw ?></a>
<a class="dropdown-item text-warning" href="index.php?lang=de&site=listsw"><?php echo str_listsw ?></a>
<div class="dropdown-divider"></div>
<a class="dropdown-item text-warning" href="#"><?php echo str_srchhw ?></a>
<a class="dropdown-item text-warning" href="#"><?php echo str_srchsw ?></a>
</div>
</li>
</ul>
</div>
</nav>
[/src]
footer.php
[src=html5]<footer class="fixed-bottom bg-dark text-white mt-4 text-center border-top border-warning">
<div class="container-fluid py-3">
Amigo! The Retro Collector © 2019 Neocrypton
</div>
</footer>[/src]
dashboard.php
[src=html5]<div class="container-fluid text-light ">
<div class="row">
<div class="col rounded-lg bg-secondary ml-1 mr-1 mb-1 mt-2 text-center">
<img src="./img/128/addsw128.png" class="d-inline-block align-top m-2" alt="">
<img src="./img/128/addhw128.png" class="d-inline-block align-top m-2" alt="">
</div>
<div class="col rounded-lg bg-secondary mr-1 ml-0 mb-1 mt-2 text-center">
<img src="./img/128/srchsw128.png" class="d-inline-block align-top m-2" alt="">
<img src="./img/128/srchhw128.png" class="d-inline-block align-top m-2" alt="">
<img src="./img/128/cllctvw128.png" class="d-inline-block align-top m-2" alt="">
</div>
<div class="w-100"></div>
<div class="col rounded-lg bg-secondary ml-1 mr-1 mb-1 mt-0 text-center"></div>
<div class="col rounded-lg bg-secondary ml-0 mr-1 mb-1 mt-0 text-center">Column</div>
<div class="w-100"></div>
<div class="col rounded-lg bg-secondary mr-1 ml-1 mt-2">Column</div>
</div>
</div>[/src]
Ich habe den footer fixiert, da ich gerne immer unten in voller breite haben möchte. das klappte von der optik her super.
den contentinhalt hingegen der sich in der dashboard.php befindet, hätte cih gern scrollbar. das ist aktuell auf der desktop ansicht nicht notwendig, aber am smartphone müsste ich etwas scrollen damit ich den unteren rest dargestellt bekäme... leider krieg ich das grade absolut nicht hin.. ich habe es bereits mit der eigenschaft overflow-auto im DIV-Container der dashboard.php probiert. dies macht mir jedoch leider nicht den content scrollbar wie ursprünglich von mir erwartet :/
ich hoffe es wird in etwa verstanden was ich meine und jemand von euch kann mir helfen. schonmal danke im vorraus
Zuletzt bearbeitet: