0
Ich weiß nicht, wie man etwas mit CSS oder JS formatiert, ich brauche Hilfe, weil ich etwas neues wissen wollte.Wie formatiere ich eine Fußzeile in reinem CSS?
body {
font-family: Oswald;
background-color: #FFFFFF;
}
#header {
background-image: url(bg.jpg);
background-size: cover;
background-attachment: fixed;
font-size: 45px;
}
#header .top {
font-size: 95px;
border: 25px solid #FFFFFF;
color: #FFFFFF;
visibility: visible;
}
#header h2 {
visibility: hidden;
}
blockquote {
color: #000000;
}
a {
text-decoration: none;
color: #FFFFFF;
}
a:hover {
color: #0C7FDA;
}
nav {
font-size: 45px;
padding: 8px;
margin: 5px;
margin-bottom: 10px;
position: fixed;
top: 75px;
left: 498px;
background-color: #795548;
background-size: cover;
display: inline;
box-shadow: 4px 3px 8px 2px;
/* For some material effect :D */
}
nav a:hover {
color: #4CAF50;
}
aside {
float: right;
}
article {
float: left;
}
#hidden {
visibility: hidden;
}
#topheader {
background-color: #FDEB0F;
padding: 4px;
border: 5px solid #000000;
margin: 5px;
box-shadow: 7px 5px 14px 3px #4E4545;
}
#topheader h1 {
font-size: 65px;
}
#topheader p {
font-size: 20px;
padding: 6px;
}
#blogpart {
margin: 5px;
margin-top: 10px;
padding: 9px;
}
#blogpart a {
color: #000000;
}
#blogpart a:hover {
color: #383838;
}
#blogpart .blog {
background-color: #FDEB0F;
border: 5px solid #000000;
padding: 4px;
margin: 5px;
box-shadow: 7px 5px 14px 3px #4E4545;
font-size: 35px;
width: 675px;
float: left;
}
#blogpart h1 {
display: inline;
font-size: 125px;
margin-bottom: 9px;
}
#blogpart .subscr {
background-color: #FDEB0F;
border: 5px solid #000000;
padding: 4px;
margin: 5px;
box-shadow: 7px 5px 14px 3px #4E4545;
font-size: 35px;
}
footer {
height: 150px;
margin-top: 80px;
}
#footerContainer ul {
list-style-image: url(whitespace.png);
list-style-position: inside;
}
#footerContainer a {
color: #000000;
}
#footerContainer a:hover {
color: #0C7FDA;
}
#thisContainer {
margin: 50px;
padding: 15px;
}
#title {
text-decoration: underline;
font-size: 20px;
}
#footerContainer {
padding: 25px;
height: 30px;
}<!DOCTYPE HTML>
<html>
<head>
<title>Modulus</title>` `
<link rel="shortcut icon" href="">`
</head>
<link rel="stylesheet" href="style.css">
<body>
<header id="header" align="center">
<nav align="center">
<a href="index.html">Home</a>
<a href="blog.html">Blog</a>
<a href="download.html">IDE</a>
<a href="about.html">Us</a>
</nav>
<h2>hidden</h2>
<h1 class="top">MODULUS </h1>
<a href="#hidden">Scroll Me Down</a>
</header>
<h1 id="hidden">hidden</h1>
<div id="topheader" align="center">
<h1>Programming With Style.</h1>
<!--<img></img> will be done someday later-->
<a href="dw1.html">
<?xml version="1.0"?>
<svg width="245" height="109.99999999999999" xmlns="http://www.w3.org/2000/svg" xmlns:svg="http://www.w3.org/2000/svg">
<!-- Created with SVG-edit - https://github.com/SVG-Edit/svgedit-->
<defs>
<linearGradient y2="0" x2="1" y1="0" x1="0" id="svg_9">
<stop offset="0" stop-color="#2196f3"/>
<stop offset="1" stop-color="#3f51b5"/>
</linearGradient>
<linearGradient id="svg_4">
<stop stop-color="#03a9f4" offset="0"/>
<stop stop-color="#4b49d0" offset="1"/>
</linearGradient>
</defs>
<g class="layer">
<title>Layer 2</title>
<rect id="svg_3" height="71" width="211" y="24.5" x="21.5" stroke-width="5" stroke="#232426" fill="#232426"/>
</g>
<g class="layer">
<title>Layer 1</title>
<rect stroke="url(#svg_4)" id="svg_2" height="72.281252" width="211.453124" y="17.499996" x="15.765641" stroke-linecap="null" stroke-linejoin="null" stroke-dasharray="null" stroke-width="5" fill="url(#svg_9)"/>
<text fill="#000000" stroke="url(#svg_4)" stroke-width="0" stroke-dasharray="null" stroke-linejoin="null" stroke-linecap="null" x="33.5" y="58" id="svg_6" font-size="24" font-family="serif" text-anchor="middle" xml:space="preserve"/>
<text fill="#000000" stroke="url(#svg_4)" stroke-width="0" stroke-dasharray="null" stroke-linejoin="null" stroke-linecap="null" x="78.5" y="74" id="svg_7" font-size="24" font-family="serif" text-anchor="middle" xml:space="preserve"/>
<text fill="#000000" stroke="url(#svg_4)" stroke-width="0" stroke-dasharray="null" stroke-linejoin="null" stroke-linecap="null" x="46.5" y="58" id="svg_8" font-size="24" font-family="serif" text-anchor="middle" xml:space="preserve"/>
<text fill="#000000" stroke="url(#svg_4)" stroke-width="0" stroke-dasharray="null" stroke-linejoin="null" stroke-linecap="null" x="36.5" y="40" id="svg_10" font-size="24" font-family="serif" text-anchor="middle" xml:space="preserve"/>
<text fill="#000000" stroke="url(#svg_4)" stroke-width="0" stroke-dasharray="null" stroke-linejoin="null" stroke-linecap="null" x="36.5" y="40" id="svg_11" font-size="24" font-family="serif" text-anchor="middle" xml:space="preserve"/>
<text fill="#000000" stroke="url(#svg_4)" stroke-width="0" stroke-dasharray="null" stroke-linejoin="null" stroke-linecap="null" x="53.5" y="47" id="svg_12" font-size="24" font-family="serif" text-anchor="middle" xml:space="preserve"/>
<text fill="#000000" stroke="url(#svg_4)" stroke-width="0" stroke-dasharray="null" stroke-linejoin="null" stroke-linecap="null" x="53.5" y="47" id="svg_13" font-size="24" font-family="serif" text-anchor="middle" xml:space="preserve"/>
<text fill="#000000" stroke="url(#svg_4)" stroke-width="0" stroke-dasharray="null" stroke-linejoin="null" stroke-linecap="null" x="153.5" y="76" id="svg_14" font-size="24" font-family="serif" text-anchor="middle" xml:space="preserve"/>
<text fill="#000000" stroke="url(#svg_4)" stroke-width="0" stroke-dasharray="null" stroke-linejoin="null" stroke-linecap="null" x="25.5" y="59" id="svg_15" font-size="24" font-family="serif" text-anchor="middle" xml:space="preserve"/>
<text fill="#000000" stroke="url(#svg_4)" stroke-width="0" stroke-dasharray="null" stroke-linejoin="null" stroke-linecap="null" x="25.5" y="59" id="svg_16" font-size="24" font-family="serif" text-anchor="middle" xml:space="preserve"/>
<text fill="#000000" stroke="url(#svg_4)" stroke-width="0" stroke-dasharray="null" stroke-linejoin="null" stroke-linecap="null" x="25.5" y="59" id="svg_17" font-size="24" font-family="serif" text-anchor="middle" xml:space="preserve"/>
<text fill="#000000" stroke="url(#svg_4)" stroke-width="0" stroke-dasharray="null" stroke-linejoin="null" stroke-linecap="null" x="49.5" y="51" id="svg_18" font-size="24" font-family="serif" text-anchor="middle" xml:space="preserve"/>
<text fill="#000000" stroke="url(#svg_4)" stroke-width="0" stroke-dasharray="null" stroke-linejoin="null" stroke-linecap="null" x="49.5" y="51" id="svg_19" font-size="24" font-family="serif" text-anchor="middle" xml:space="preserve"/>
<text fill="#ff0000" stroke="url(#svg_4)" stroke-width="0" stroke-dasharray="null" stroke-linejoin="null" stroke-linecap="null" x="32.5" y="43" id="svg_20" font-size="24" font-family="serif" text-anchor="middle" xml:space="preserve"/>
<text fill="#003fff" stroke-width="0" stroke-dasharray="null" stroke-linejoin="null" stroke-linecap="null" x="172.96419" y="60.518913" id="svg_21" font-size="24" font-family="Raleway ExtraBold" text-anchor="middle" xml:space="preserve" transform="matrix(1.193534190937388,0,0,1.1781938114650772,-90.23664805013107,-19.975664084182355) " stroke="url(#svg_4)">Download for</text>
<text fill="#003fff" stroke="url(#svg_4)" stroke-width="0" stroke-dasharray="null" stroke-linejoin="null" stroke-linecap="null" x="117.5" y="76" id="svg_22" font-size="24" font-family="Raleway ExtraBold" text-anchor="middle" xml:space="preserve">64-bit</text>
<ellipse fill="#003fff" stroke="url(#svg_4)" stroke-width="5" stroke-dasharray="null" stroke-linejoin="null" stroke-linecap="null" cx="138.5" cy="-51" rx="0" ry="0" id="svg_23"/>
</g>
</svg>
</a>
<p>Programming has never been this easier. You can now program <br/> with add-ons to help you build projects with running packages, and you <br /> can choose your own languages that you wanted to run. Never been this easier, <br /> it's the perfect editor
for people who are mixed--Front-End and Back-End Web <br /> development, for Software-Building and System Development, we all got you here.</p>
</div>
<h1 id="hidden">hidden</h1>
<div id="blogpart">
<article class="blog" style="width: 675px;">
<section class="top1">
<?xml version="1.0"?>
<svg width="90" height="137" xmlns="http://www.w3.org/2000/svg" xmlns:svg="http://www.w3.org/2000/svg">
<!-- Created with SVG-edit - https://github.com/SVG-Edit/svgedit-->
<defs>
<linearGradient y2="0" x2="1" y1="0" x1="0" id="svg_5">
<stop offset="0" stop-color="#f44336"/>
<stop offset="0.51044" stop-color="#9c27b0"/>
<stop offset="1" stop-color="#ffeb3b"/>
<stop offset="2" stop-color="#ffeb3b"/>
</linearGradient>
<linearGradient y2="1" x2="0.5" y1="0" x1="0.5" id="svg_8">
<stop offset="0" stop-color="#f44336"/>
<stop offset="0.51044" stop-color="#9c27b0"/>
<stop offset="1" stop-color="#ffeb3b"/>
<stop offset="2" stop-color="#ffeb3b"/>
</linearGradient>
</defs>
<g display="inline" class="layer">
<title>Read Our Blog!</title>
<text id="svg_4" font-weight="bold" stroke="#000000" transform="matrix(3.1195437761256533,0,0,3.1195437761256533,29.045285399217367,-24.321406977693613) " xml:space="preserve" text-anchor="middle" font-family="Bebas Neue" font-size="27" y="30.688799" x="3.416073" stroke-width="0" fill="#383838">BL</text>
<text id="svg_6" font-weight="bold" stroke="#000000" transform="matrix(3.1195437761256533,0,0,3.1195437761256533,29.045285399217367,-24.321406977693613) " xml:space="preserve" text-anchor="middle" font-family="Bebas Neue" font-size="27" y="51.205177" x="3.325263" stroke-width="0" fill="#383838">OG</text>
<rect id="svg_7" stroke="#000000" height="121.000004" width="11" y="13.670578" x="76.662292" stroke-linecap="null" stroke-linejoin="null" stroke-dasharray="null" stroke-width="0" fill="#383838"/>
</g>
<g class="layer">
<title>Blog</title>
<text font-weight="bold" stroke="#000000" transform="matrix(3.1195437761256533,0,0,3.1195437761256533,29.045285399217367,-24.321406977693613) " xml:space="preserve" text-anchor="middle" font-family="Bebas Neue" font-size="27" id="svg_1" y="28.87104" x="2.24209" stroke-width="0" fill="url(#svg_5)">BL</text>
<text id="svg_2" font-weight="bold" stroke="#000000" transform="matrix(3.1195437761256533,0,0,3.1195437761256533,29.045285399217367,-24.321406977693613) " xml:space="preserve" text-anchor="middle" font-family="Bebas Neue" font-size="27" y="49.387418" x="2.15128" stroke-width="0" fill="url(#svg_5)">OG</text>
<rect stroke="#000000" id="svg_3" height="121.000004" width="11" y="8" x="73" stroke-linecap="null" stroke-linejoin="null" stroke-dasharray="null" stroke-width="0" fill="url(#svg_8)"/>
</g>
</svg>
<h1>Version 3.5</h1>
</section>
<blockquote>
<p>The release of Version 3.5. is a very <br /> big milestone for us...<a href="blog.html">Read More</a>.</p>
</blockquote>
<section class="suprtrs">
<h2>95.2k Subscribers <br /> 1.01m Likes <br /> 12.7m Downloads <br /> 43.4k Commits</h2>
</section>
</article>
<aside class="subscr" align="center">
<h1>Subscribe</h1>
<form method="POST" action="mailto:[email protected]">
<input id="email" class="input" name="email" type="text" placeholder="type your email here..." size="35" style="height: 60px; font-size: 25px; font-family: Oswald;"> <br />
<a href="mailto:[email protected]" type="submit">
<?xml version="1.0"?>
<svg width="185" height="95" xmlns="http://www.w3.org/2000/svg" xmlns:svg="http://www.w3.org/2000/svg">
<!-- Created with SVG-edit - https://github.com/SVG-Edit/svgedit-->
<defs>
<linearGradient y2="0" x2="1" y1="0" x1="0" id="svg_5">
<stop stop-color="#8bc34a" offset="0"/>
<stop stop-color="#ff9800" offset="0.47137"/>
<stop stop-color="#ffeb3b" offset="1"/>
</linearGradient>
<linearGradient id="svg_3">
<stop stop-color="#97e537" offset="0"/>
<stop stop-color="#ffb343" offset="0.47137"/>
<stop stop-color="#ffed4f" offset="1"/>
</linearGradient>
</defs>
<g class="layer">
<title>Subscribe to Our Newsletter</title>
<rect id="svg_2" fill="#383838" stroke="#383838" stroke-width="5" x="16" y="17" width="162" height="70" rx="11" ry="11"/>
</g>
<g class="layer">
<title>Click Here To Subscribe</title>
<rect fill="url(#svg_5)" stroke="url(#svg_3)" stroke-width="5" x="11.5" y="12.5" width="162" height="70" id="svg_1" rx="11" ry="11"/>
<text fill="#fffa84" stroke-width="0" stroke-dasharray="null" stroke-linejoin="null" stroke-linecap="null" x="73.73987" y="51.5" id="svg_4" font-size="24" font-family="Raleway ExtraBold" text-anchor="middle" xml:space="preserve" transform="matrix(1.3155649900436401,0,0,1.3155649900436401,-5.083554761484265,-8.993602216243744) " stroke="url(#svg_3)">Subscribe</text>
</g>
</svg>
</a>
</form>
<p>A Developer? <a href="sign-in.html">Sign In</a>.</p>
</aside>
</div>
<br />
<footer>
<script>
for (i = 1; i <= 29; i++) {
document.write("<br />")
}
</script>
<div class="thisContainer">
<div id="footerContainer">
<ul class="first-part">
<li id="title">MODULUS</li>
<li><a href="download.html">Downloads</a></li>
<li><a>GitHub</a></li>
<!--Adding Link if Existing-->
<li><a href="blog.html">Blog</a></li>
<li><a href="faq.html">FAQ</a></li>
<li><a href="faq-blog-for.html">Forums</a></li>
</ul>
<ul class="secnd-part">
<li id="title">SOCIAL</li>
<!--Links Coming if Existing-->
<li><a>Facebook</a></li>
<li><a>Twitter</a></li>
<li><a>Instagram</a></li>
<li><a>Medium</a></li>
<li><a>Tumblr</a></li>
</ul>
<ul class="third-part">
<li id="title">SERVICES</li>
<li><a href="download.html">IDE</a></li>
<li><a href="mod-enable-prem.html">Premium</a></li>
<li><a href="mod-parent-domname.html">Domians</a></li>
<li><a href="mod-m-donate.html">Donate</a></li>
<br>
<li><a href="about.html">ABOUT US</a></li>
<li>
<p> 2017, MODULUS</p>
</li>
</ul>
</div>
</div>
</footer>
</body>
</html>Ich habe tatsächlich ein Problem mit diesem Code. Ich brauche Hilfe beim Formatieren der Fußzeile, ich weiß eigentlich nicht wie.
Also das Problem, dass es zeilenweise angezeigt wird. Ich wollte eigentlich die Listen nebeneinander haben. Kann ich bitte Hilfe bei der Lösung haben?