Ich brauche mal Eure Hilfe.
ich bin dabei eine Webseite zu erstellen und habe Probleme Features.
Ich möchte ein paar Icons hinzufügen und komme nicht weiter.
Alle stimmt bis ich die Klasse eingebe dann verschwindet auf einmal die linke Spalte(wrapper)
Suche schon seit Std nach einer Lösung aber komme nicht weiter.
Bitte um schnelle Hilfe
hier der html code:
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8" />
<title>Eine erste Seite</title>
<link rel="stylesheet" type="text/css" href="./vendor/skeleton/normalize.css" />
<link rel="stylesheet" type="text/css" href="./vendor/skeleton/skeleton.css" />
<link rel="stylesheet" type="text/css" href="./css/styles.css" />
<link href="https://fonts.googleapis.com/css?family=Muli:200,300,400,700" rel="stylesheet" />
<link
href="https://maxcdn.bootstrapcdn.com/font-awesome/4.7.0/css/font-awesome.min.css"
rel="stylesheet"
integrity="sha384-wvfXpqpZZVQGK6TAh5PVlGOfQNHSoD2xbE+QkPxCAFlNEevoEH3Sl0sibVcOQVnN"
crossorigin="anonymous" />
</head>
<body>
<header class="header">
<div class="container">
<div class="header-brand-wrapper">
<a class="header-brand" href="index.html">ESCAPE</a>
</div>
<nav class="header-navbar">
<ul class="header-navbar-links">
<li>Home</li>
<li>Services</li>
<li>Clients</li>
<li>Team</li>
<li>Contact</li>
</ul>
</nav>
</div>
<div class="container">
<div class="slogan">
<div class="slogan-top">
Können Sie eine Webseite für uns entwickeln?
</div>
<div class="slogan-bottom">
Ja, wir können das!
</div>
<button class="solgan-button">
Mehr erfahren!
</button>
</div>
</div>
</header>
<div class="service">
<div class="container">
<div class="row">
<div class="eight columns">
<h1 class="service-title">Web <strong>Development</strong></h1>
<p>
Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod
tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam,
quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo
consequat.
</p>
<p>
Excepteur sint occaecat cupidatat non proident, sunt in culpa qui officia
deserunt mollit anim id est laborum. Lorem ipsum dolor sit amet, consectetur
adipiscing elit.
</p>
</div>
<div class="four columns">
<div class="service-icon">
<i class="fa fa-html5" aria-hidden="true"></i>
</div>
</div>
</div>
</div>
</div>
<div class="service service-gray">
<div class="container">
<div class="row">
<div class="four columns">
<div class="service-icon">
<i class="fa fa-id-card-o" aria-hidden="true"></i>
</div>
</div>
<div class="eight columns">
<h1 class="service-title">Identity <strong>Branding</strong></h1>
<p>
Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod
tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam,
quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo
consequat.
</p>
<p>
Excepteur sint occaecat cupidatat non proident, sunt in culpa qui officia
deserunt mollit anim id est laborum. Lorem ipsum dolor sit amet, consectetur
adipiscing elit.
</p>
</div>
</div>
</div>
</div>
<div class="features">
<div class="container">
<div class="row">
<div class="six columns">
<div class="feature-icon">
</div>
<div class="six columns">
2. Spalte
</div>
</div>
</div>
</body>
</html>
---------------------------------------------------------------------------
css Code:
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8" />
<title>Eine erste Seite</title>
<link rel="stylesheet" type="text/css" href="./vendor/skeleton/normalize.css" />
<link rel="stylesheet" type="text/css" href="./vendor/skeleton/skeleton.css" />
<link rel="stylesheet" type="text/css" href="./css/styles.css" />
<link href="https://fonts.googleapis.com/css?family=Muli:200,300,400,700" rel="stylesheet" />
<link
href="https://maxcdn.bootstrapcdn.com/font-awesome/4.7.0/css/font-awesome.min.css"
rel="stylesheet"
integrity="sha384-wvfXpqpZZVQGK6TAh5PVlGOfQNHSoD2xbE+QkPxCAFlNEevoEH3Sl0sibVcOQVnN"
crossorigin="anonymous" />
</head>
<body>
<header class="header">
<div class="container">
<div class="header-brand-wrapper">
<a class="header-brand" href="index.html">ESCAPE</a>
</div>
<nav class="header-navbar">
<ul class="header-navbar-links">
<li>Home</li>
<li>Services</li>
<li>Clients</li>
<li>Team</li>
<li>Contact</li>
</ul>
</nav>
</div>
<div class="container">
<div class="slogan">
<div class="slogan-top">
Können Sie eine Webseite für uns entwickeln?
</div>
<div class="slogan-bottom">
Ja, wir können das!
</div>
<button class="solgan-button">
Mehr erfahren!
</button>
</div>
</div>
</header>
<div class="service">
<div class="container">
<div class="row">
<div class="eight columns">
<h1 class="service-title">Web <strong>Development</strong></h1>
<p>
Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod
tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam,
quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo
consequat.
</p>
<p>
Excepteur sint occaecat cupidatat non proident, sunt in culpa qui officia
deserunt mollit anim id est laborum. Lorem ipsum dolor sit amet, consectetur
adipiscing elit.
</p>
</div>
<div class="four columns">
<div class="service-icon">
<i class="fa fa-html5" aria-hidden="true"></i>
</div>
</div>
</div>
</div>
</div>
<div class="service service-gray">
<div class="container">
<div class="row">
<div class="four columns">
<div class="service-icon">
<i class="fa fa-id-card-o" aria-hidden="true"></i>
</div>
</div>
<div class="eight columns">
<h1 class="service-title">Identity <strong>Branding</strong></h1>
<p>
Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod
tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam,
quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo
consequat.
</p>
<p>
Excepteur sint occaecat cupidatat non proident, sunt in culpa qui officia
deserunt mollit anim id est laborum. Lorem ipsum dolor sit amet, consectetur
adipiscing elit.
</p>
</div>
</div>
</div>
</div>
<div class="features">
<div class="container">
<div class="row">
<div class="six columns">
<div class="feature-icon">
</div>
<div class="six columns">
2. Spalte
</div>
</div>
</div>
</body>
</html>