Beiträge von paradiesvogel

    Vielen Dank für die Hilfe aber verstehe das nicht so ganz wo ich den Style hinpacken soll an welcher Stelle?


    Sobald ich diesen in die index packe verschwindet ganz das Design


    Das CSS ist aus in einer anderen Datei und diese ist doch verlinkt oder etwa nicht?

    Was ist Fiddel?


    Klar, hier der Code


    </>

    <!DOCTYPE html>

    <html lang="en" class="no-js">

    <head>

    <meta charset="utf-8">

    <meta http-equiv="X-UA-Compatible" content="IE=edge">

    <title>Fluidsounds</title>


    <meta name="description" content="">

    <meta name="viewport" content="width=device-width, initial-scale=1.0">


    <link rel="shortcut icon" href="/images/favicon.png">

    <link rel="apple-touch-icon" sizes="57x57" href="/images/apple-touch-icon.png">

    <link rel="apple-touch-icon" sizes="72x72" href="/images/apple-touch-icon-72x72.png">

    <link rel="apple-touch-icon" sizes="114x114" href="/images/apple-touch-icon-114x114.png">


    <link rel="stylesheet" href="style.css">

    <link rel="stylesheet" href="custom.css">


    <script src="js/modernizr.js"></script>

    </head>

    <body>

    <header class="fs-header">

    <div class="container row">

    <div class="col col-5 fs-logo">

    </div>

    <div class="col col-7 fs-menu">

    <nav>

    <ul>

    <li><a href="#">Home</a></li>

    <li><a href="#">Artists</a></li>

    <li><a href="#">Shop</a></li>

    <li><a href="#">Contact</a></li>

    <li><a href="#">Login</a></li>

    </ul>


    </nav>

    </div>

    </div>

    </header>


    <section class="fs-subheader">

    <div class="behind">


    <div class="left">

    </div>

    <div class="right">

    </div>

    <div class="before">

    </div>

    </section>


    <section class="fs-content">

    <div class="container">

    <article>

    <h1>Überschrift 1</h1>

    <p>LoremLorem ipsum dolor sit amet, consetetur sadipscing elitr, sed diam nonumy eirmod tempor invidunt ut labore et dolore

    magna aliquyam erat, sed diam voluptua. At vero eos et accusam et justo duo dolores et ea rebum.

    Stet clita kasd gubergren, no sea takimata sanctus est Lorem ipsum dolor sit amet.

    Lorem ipsum dolor sit amet, consetetur sadipscing elitr, sed diam nonumy eirmod

    tempor invidunt ut labore et dolore magna aliquyam erat, sed diam voluptua.

    At vero eos et accusam et justo duo dolores et ea rebum. Stet clita kasd gubergren,

    no sea takimata sanctus est Lorem ipsum dolor sit amet.

    </P>

    <h2>Überschrift 2</h2>

    <p>LoremLorem ipsum dolor sit amet, consetetur sadipscing elitr, sed diam nonumy eirmod tempor invidunt ut labore et dolore

    magna aliquyam erat, sed diam voluptua. At vero eos et accusam et justo duo dolores et ea rebum.

    Stet clita kasd gubergren, no sea takimata sanctus est Lorem ipsum dolor sit amet.

    Lorem ipsum dolor sit amet, consetetur sadipscing elitr, sed diam nonumy eirmod

    tempor invidunt ut labore et dolore magna aliquyam erat, sed diam voluptua.

    At vero eos et accusam et justo duo dolores et ea rebum. Stet clita kasd gubergren,

    no sea takimata sanctus est Lorem ipsum dolor sit amet.

    </P>

    <h3>Überschrift 3</h3>

    <p>LoremLorem ipsum dolor sit amet, consetetur sadipscing elitr, sed diam nonumy eirmod tempor invidunt ut labore et dolore

    magna aliquyam erat, sed diam voluptua. At vero eos et accusam et justo duo dolores et ea rebum.

    Stet clita kasd gubergren, no sea takimata sanctus est Lorem ipsum dolor sit amet.

    Lorem ipsum dolor sit amet, consetetur sadipscing elitr, sed diam nonumy eirmod

    tempor invidunt ut labore et dolore magna aliquyam erat, sed diam voluptua.

    At vero eos et accusam et justo duo dolores et ea rebum. Stet clita kasd gubergren,

    no sea takimata sanctus est Lorem ipsum dolor sit amet.

    </P>

    <h4>Überschrift 4</h4>

    <p>LoremLorem ipsum dolor sit amet, consetetur sadipscing elitr, sed diam nonumy eirmod tempor invidunt ut labore et dolore

    magna aliquyam erat, sed diam voluptua. At vero eos et accusam et justo duo dolores et ea rebum.

    Stet clita kasd gubergren, no sea takimata sanctus est Lorem ipsum dolor sit amet.

    Lorem ipsum dolor sit amet, consetetur sadipscing elitr, sed diam nonumy eirmod

    tempor invidunt ut labore et dolore magna aliquyam erat, sed diam voluptua.

    At vero eos et accusam et justo duo dolores et ea rebum. Stet clita kasd gubergren,

    no sea takimata sanctus est Lorem ipsum dolor sit amet.

    </P>

    </article>

    </div>

    </section>

    <section class="fs-player">

    <div class="container row">

    <div class="col col-1">

    </div>

    <div class="col col-11">

    </div>

    </div>

    </section>


    <footer class="fs-footer">

    <div class="container row">

    <div class="col col-3 fs-footer-website">

    <h4>Website</h4>

    <ul>

    <li><a href="#">Home</a></li>

    <li><a href="#">Artists</a></li>

    <li><a href="#">Shop</a></li>

    <li><a href="#">Contact</a></li>

    <li><a href="#">Login</a></li>

    </ul>

    </div>

    <div class="col col-3 fs-footer-artists">

    <h4>Artists</h4>

    <ul>

    <li><a href="#">Musicman</a></li>

    <li><a href="#">Master of the Sound</a></li>

    <li><a href="#">Red Glasses</a></li>

    <li><a href="#">Holy Soul</a></li>

    <li><a href="#">Kevin Kilsby</a></li>

    </ul>

    </div>

    <div class="col col-3 fs-footer-new">

    <h4>New Releases</h4>

    <ul>

    <li><a href="#">In the World of Bass</a></li>

    <li><a href="#">Living Guitar</a></li>

    <li><a href="#">Juno & More</a></li>

    <li><a href="#">Superfly</a></li>

    </ul>

    </div>

    <div class="col col-3 fs-footer-info">

    <h4>Get Social!</h4>

    <ul class="fs-social">

    <li><a href="#"><img src="images/icon-skype.png"></a></li>

    <li><a href="#"><img src="images/icon-google-plus.png"></a></li>

    <li><a href="#"><img src="images/icon-twitter.png"></a></li>

    <li><a href="#"><img src="images/icon-facebook.png"></a></li>

    </ul>

    <h4>Pay with</h4>

    <ul class="fs-payment">

    <li><a href="#"><img src="images/icon-visa.png"></a></li>

    <li><a href="#"><img src="images/icon-paypal.png"></a></li>

    <li><a href="#"><img src="images/icon-mastercard.png"></a></li>

    </ul>

    </div>

    </div>

    </footer>


    <script src="http://ajax.googleapis.com/ajax/libs/jquery/1.11.0/jquery.min.js"></script>

    <script src="js/default.js"></script>

    </body>

    </html>

    body {

    background-color: #1C5052;

    }


    a {

    text-decoration: none;

    }


    header {

    height: 111px;

    background: #262e30; /* Old browsers */

    background: -moz-linear-gradient(top, #262e30 0%, #0a0c0d 100%); /* FF3.6+ */

    background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,#262e30), color-stop(100%,#0a0c0d)); /* Chrome,Safari4+ */

    background: -webkit-linear-gradient(top, #262e30 0%,#0a0c0d 100%); /* Chrome10+,Safari5.1+ */

    background: -o-linear-gradient(top, #262e30 0%,#0a0c0d 100%); /* Opera 11.10+ */

    background: -ms-linear-gradient(top, #262e30 0%,#0a0c0d 100%); /* IE10+ */

    background: linear-gradient(to bottom, #262e30 0%,#0a0c0d 100%); /* W3C */

    filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#262e30', endColorstr='#0a0c0d',GradientType=0 ); /* IE6-9 */

    -webkit-box-shadow: 0px 5px rgba(0, 0, 0, 0.3);

    -moz-box-shadow: 0px 5px rgba(0, 0, 0, 0.3);

    box-shadow: 0px 5px rgba(0, 0, 0, 0.3);

    position: relative;

    z-index: 10;

    }


    header .fs-menu {}

    text-align: right;


    header .row {

    padding-top: 0px;

    }


    header .fs-logo {

    background: url("images/logo.png");

    width: 389px;

    height: 52px;

    margin-top: 10px;

    }


    header nav {

    height: 111px;

    overflow: hidden;

    }


    header nav ul {

    list-style-type: none;

    padding: 0px;

    margin: 0px;

    }


    header nav ul li {

    display: inline-block;

    padding: 0px 0 0 40px;

    }


    header nav ul li a {

    line-height: 111px;

    color: #dedede;

    font-size: 1.1em;

    }


    header nav ul li a:hover {

    color: f2f2f2;

    }



    .fs-subheader {

    overflow: hidden;

    height: 107px;

    background: #203B3B;

    }


    .fs-subheader .behind {

    position: absolute;

    width: 100%;

    height: 107px;

    }


    .fs-subheader .behind .left,

    .fs-subheader .behind .right {

    display: inline-block;

    height: 107px;

    width: 50%;

    }


    .fs-subheader .behind .right {

    background: #5B6E6E;

    }


    .fs-subheader .before {

    position: relative;

    z-index: 1;

    background: url("images/bg-subheader.png");

    height: 107px;

    width: 1280px;

    margin-left: auto;

    margin-right: auto;

    }


    .fs-content {

    background: #F2F2F2;

    min-height: 300px;

    padding: 2em;

    }


    .fs-player {

    background: url("images/bg-player.png");

    height: 81px;

    border-top: 1px solid #c7c7c7;

    -webkit-box-shadow: 0px 5px rgba(0, 0, 0, 0.3);

    -moz-box-shadow: 0px 5px rgba(0, 0, 0, 0.3);

    box-shadow: 0px 5px rgba(0, 0, 0, 0.3);



    }


    footer {

    padding-top: 1.25em;

    text-shadow: 2px 2px 4px rgba(0, 0, 0, 0.8);

    }


    footer h4 {

    color: #f2f2f2;

    }


    footer ul {

    padding: 0;

    margin: 0;

    list-style-type: none;

    }


    footer ul li a {

    color: #dadede;

    }


    footer ul li a: hover {

    color: #f2f2f2;

    }


    footer .fs-footer-info ul li {

    display: inline-block;

    }



    footer .fs-footer-info img {

    width: 38px;

    height: 38px;

    -webkit-box-shadow: 0px 5px rgba(0, 0, 0, 0.8);

    -moz-box-shadow: 0px 5px rgba(0, 0, 0, 0.8);

    box-shadow: 0px 5px rgba(0, 0, 0, 0.8);

    }

    </>

    Brauche mal Eure Hilfe :)

    arbeite gerade ein Tutorialvideo durch und bekomme einfach nicht im subheader das Bild rein obwohl der Code und die Bildquelle stimmt.


    Suche schon seit Stunden und finde nicht den Fehler.


    Bitte um Hilfe.


    LG


    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>

    Ich versuche bei Brackets und Notepad++ den Autokomplete zu aktivieren um Vorschläge beim Programmieren zu bekommen aber da wird nichts vorfeschlagen .


    Normal reicht es wenn ich 2-3 Bichstaben wie doc (document) eingebe schlägt Brackets oder Notepad++ den befefehl vor aber seit gestern geht es nicht.


    Kann mir da bitte jemand verraten woran das liegt?


    Vielen herzlichen Dank im Voraus.

    Hallo zusammen ?( ?(
    ich mache über einen Videokurs einen CSS Kurs aber obwohl ich genau dieselben Codes eingebe habe ich ein anderes Ergebnis.
    Ist das möglich?
    Och suche mir schon den Wolf und verzweifel bald.


    Trotz des gleichen Codes werden mir die Links nicht weiss angezeigt.
    Woran liegt das?


    Vielen Dank im Voraus.
    Grüße
    Ivica
    Hier der Code
    <style type="text/css">


    #topleiste{


    background-color: #42587E;
    width:100%;
    height: 35px;
    float: left;
    }


    #topleiste li {


    list-style: none;
    float: left;
    }


    a:link{


    color:white;
    text-decoration:none;
    font-size: 16px;
    padding: 10px 5px 1px 5px;
    }