Beiträge von djheke

djheke

So vielleicht.

<?php

$tag = date('w');

if ($tag == 0 or $tag == 6) {

print "Am Wochenende sind keine Bestellungen möglich!";

} else {

print '<a href="pdf/Menu_<%=yyyymmdd%>.pdf" target="_blank" name="cls" id="lllink">Mittagsmenu</a>';

}

?>

djheke

Oder so!?

Code

html, body {
background-color: grey;
width: 100%;
height: 100%;
margin: 0;
       box-sizing:border-box;
       padding-top:10px;
}
.grid {
width: 90%;
height:100%;
margin:0 auto;
display: grid;
grid-template-columns: 50% 50%;
grid-template-rows: 10% auto 5%;
grid-template-areas:
"logo menue"
"inhalt inhalt"
"footer footer"
}

Alles anzeigen

djheke

Zitat von m.scatello

Boah, basti!!!! Benutze doch mal einen Browser, der eine Rechtschreibprüfung integriert hat! Jedes Posting von dir ist eine Katastrophe!

Basti1012 gehört dem Deutschverbrechertum an.

djheke

So sollte es aber auch gehen.

HTML

<!DOCTYPE html>
<html lang="de">
<head>
<meta charset="utf-8">
<title>Misanthropia</title>
<meta name="viewport" content="width=device-width, initial-scale=1.0">

<style>
table {
 border:1px solid #000;
 border-collapse: collapse;
}

th , td {
 border:1px solid #000;
 padding:4px;
 text-align:center;
} 

</style>

</head>
<body>

<table>
<thead>
<tr>
<th>ID</th>
<th>Datum</th>
<th colspan="2">Spalte1</th>
<th colspan="2">Spalte2</th>
<th>Aktion</th>
</tr>
</thead>

<tbody>
<tr>
<td rowspan="2">1</td>
<td rowspan="2">07.11.2019</td>
<td colspan="2">Inhalt</td> 
<td colspan="2">Inhalt</td>
<td rowspan="2">Aktion</td>
</tr>
<tr>
<td>a</td>
<td>b</td>
<td>a</td>
<td>b</td>
</tr>  
  
<tr>
<td rowspan="2">2</td>
<td rowspan="2">08.11.2019</td>
<td colspan="2">Inhalt</td> 
<td colspan="2">Inhalt</td>
<td rowspan="2">Aktion</td>
</tr>
<tr>
<td>a</td>
<td>b</td>
<td>a</td>
<td>b</td>
</tr>  
</tbody>
</table>


</body>
</html>

Alles anzeigen

djheke

Guck mal hier. Vielleicht kannst Du was davon gebrauchen.

https://developer.mozilla.org/de/docs/Web/HT…X-Frame-Options

djheke

Hallo ich nochmal.

Möglicherweise hast Du schon eine brauchbare Lösung gefunden, aber ein simplen Vorschlag hätte ich noch.

HTML

<!doctype html>
<html>
<head>
<meta charset="UTF-8">
<title>Infobox</title>
<style>


.info {
display: flex;
/* Wird nur benötigt,wenn absolut positioniert werden soll
position: relative;
padding-left:100px;
*/
height:200px;
background:#ddd;
}


.info div {
margin-top:20px;
padding:10px;
overflow: auto;
flex-basis:100%;
background:#fff;
border-right:20px solid #aaa;
border-bottom:20px solid #aaa;
}


.info img {
display: inline-block;
width:70px;
height:70px;
padding:15px;
}


/* Absolut positioniert.


.info img {
display: inline-block;
width:70px;
height:70px;
position: absolute;
left:-10px;
top:-10px;
}
*/


</style>
</head>
<body>
<div  class="info">
<img src="it.png" alt="icon">
<div>
<h2>Überschrift</h2>
<ul>
<li>Aufzähling</li>
<li>Aufzähling</li>
<li>Aufzähling</li>
<li>Aufzähling</li>
<li>Aufzähling</li>
<li>Aufzähling</li>
<li>Aufzähling</li>
<li>Aufzähling</li>
<li>Aufzähling</li>
</ul>
</div>
</div>
</body>
</html>

Alles anzeigen

Vielleicht kannst Du das ja gebrauchen.

djheke

Ich habe mich an deinem Beispiel gehalten und war der Meinung, dass es auch ohne geht.Sorry!

Oder du nimmst negative Werte für margin oder top/left u.s.w.

djheke

So vielleicht.

HTML

<!doctype html>
<html>
<head>
<meta charset="UTF-8">
<title>Infobox</title>
<style>
.info {
 display:flex;
 position:relative;
 padding-left:100px;
 height:200px;
 background:#ddd;
}

.info div {
 margin:20px 0;
 padding:10px;
 overflow:auto;
 flex-basis:100%;
 background:#fff;
 border-right:20px solid #aaa;
}

.info:before {
 content:"IT";
 position:absolute;
 width:60px;
 height:60px;
 background:yellow;
 color:red;
 left:10px;
 top:10px;
 border-radius:50%;
 font-size:32px;
 display: block;
 text-align: center;
 line-height:60px;
 border:10px solid red;
}

.info:after {
 content:"";
 position:absolute;
 left:100px;
 right:0;
 bottom:0;
 height:20px;
 background:#aaa;
}
</style>
</head>
<body>
<div  class="info">
<div>
<h2>Überschrift</h2>
<ul>
 <li>Aufzähling</li>
 <li>Aufzähling</li>
 <li>Aufzähling</li> 
</ul>
</div>
</div>
</body>
</html>

Alles anzeigen

djheke

AH! Jetzt habe ich es hoffendlich vestanden. Hier mal eine schmale Version.

HTML

<!DOCTYPE html>
<html>


<head>
<title></title>
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<meta charset="utf-8" />
<style>


* {
margin:0;
padding:0;
box-sizing:border-box;
}


#wrapper {
margin:0 auto;
width:60%;
min-height:500px;
background:#000;
color:#fff;
}


#wrapper header h2 {
text-align:center;
border-top:5px solid #09c;
}


#wrapper input {
display:none;
}


#switch {
display:block;
}


#wrapper label {
padding:5px;
background:#09c;
width:25%;
float:left;
}


section , #account_out div {
display: none;
}


#account:checked ~ #account_out ,
#show:checked ~ #show_out {
display: block;
}


#account_out label {
position:absolute;
left:0;
top:0;
width:100px;
}


#account_out  div {
margin:10px;
padding:20px;
border:1px solid #fff;
background:#f00;
}


#switch:checked ~ div {
display:block;
}
</style>
</head>


<body>
<div id="wrapper">
<header><h2>VenoX Settings</h2></header>


<label for="account">Account</label><input type="radio" id="account" name="radio-group">
<label for="show">Anzeigen</label><input type="radio" id="show" name="radio-group">
<input type="radio" id="voice" name="radio-group"><label for="voice">Voice</label>
<input type="radio" id="infos" name="radio-group"><label for="infos">Informationen</label>


<section id="account_out">
<label for="switch">Account</label><input type="checkbox" name="switchoffon" id="switch">
<p>Account</p>
<div>ONOFF</div>
</section>
<section id="show_out">
<p>Show</p>
</section>


</div>
</body>
</html>

Alles anzeigen

djheke

Hab's wohl falsch verstanden.

djheke

Ich glaube Du brauchst eine verschachtelte Liste(UL).

djheke

Bei einer festen Breite sollte es auch so funktionieren.

Code

.textbox:hover span {
transform: translateX(calc(-100% + 300px ));
}

djheke

td

{

vertical-align: top;

....

}

djheke

Warum eine Tabelle für eine Navigation?

https://jsfiddle.net/abw4h63L/

djheke

Du könntest auch die Systemschriften nutzen. Wobei font:caption nur für Labels relevant ist.

Code

form input ,
form button {
padding:3px;
border:1px solid #aaa;
border-radius:4px;
font:caption;
}

djheke

http://brainstuff.com/de/index.html

Ist es dein Ernst?

djheke

#steuerungoben ul {

margin:0;

padding:0;

}

djheke

Guck mal hier. Vielleicht kannst Du was gebrauchen(sind 5 Bilder). Musst es natürlich auf Deine Bedürfnisse anpassen.

CSS-Slider

djheke

Einfacher geht's nun wirklich nicht! Suppi!

djheke

Mit Flexbox sollte es auch sehr einfach umzusetzen sein. Aber hier mal mit display:table. In Anlehnung von Axel's Tutorial.

HTML

<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>Responsive Sticky Footer</title>
<meta name="viewport" content="width=device-width, initial-scale=1">


<style type="text/css">


html, body   {
margin:0;
padding:0;
height: 100%;
}
html {
background:#444;
}
body {
display:table;
max-width:1300px;
width:100%;
margin:0 auto;
}
header {
background:#dae; border-bottom:1px solid #000;
}
section {
background:#dda;
display:table-row;
height:100%;
}


section:before {
content:"";
width:219px;
height:100%;
float:left;
-margin-left: 220px;
border-right:1px solid #000;
background:#ade;
}
section p.links {
float:left;
width:200px;
margin-left:-220px;


}
section p.rechts {
margin-left:220px;


}
footer {
background:#ed0;border-top:1px solid #000;
}
h1, p {
margin:0;
padding:10px;
}
</style>
</head>
<body>


<header>
<h1>Responsive Sticky Footer</h1>
</header>


<section>
<p class="links">linke seite</p>
<p class="rechts">rechte seite</p>
</section>


<footer>
<p>Sehr laaaaaaaaaaaaaaaaaaaaaaaaaaa  aaaaaaaaaaaaaa aaaaaaaaaaaaaa aaaaaaaaaaa aaaaaaaa aaaaaaa aaaaa aaanger Text im Footer</p>
<p>Sehr laaaaaaaaaaaaaaaaaaaaaaaaaaa  aaaaaaaaaaaaaa aaaaaaaaaaaaaa aaaaaaaaaaa aaaaaaaa aaaaaaa aaaaa aaanger Text im Footer</p>
</footer>


</body>
</html>

Alles anzeigen

Beiträge von djheke

Alternativer Link bei nicht vorhandenem Dokument

Website etwas nach unten rücken, ohne dass Layout über Bildschirm hinausgeht

Dropdown Navigation funktioniert nicht auf Smartphone

Komplexe Tabelle - rowspan und clospan

ich raffe das mit der CORS police einfach nicht

Infobox mit Rahmen

Infobox mit Rahmen

Infobox mit Rahmen

Button funktionen

Button funktionen

Button funktionen

span scroll text

DIV ungewollt zentriert

Listenhintergrund mit overflow-x

Button und Textbox auf selber Höhe

Inline frames mit CSS

Flexbox Zeile soll sich oben anordnen

bildergalerie in CSS

Footer mit dem Inhalt der Seite nach unten schieben

Footer mit dem Inhalt der Seite nach unten schieben