Beiträge von Gosi

hier noch der HTML Code

</div>
            <div id="master">
                <div class="row">
                  <div class="col-sm-6 col-md-4">
                    <div class="thumbnail">
                        <h3>Live</h3>
                      <img src="images/flyer-fb_250.jpg" alt="">
                      <div class="caption">

                        <p><a href="#" class="btn btn-primary" role="button">mehr</a></p>
                      </div>
                    </div>
                  </div>
                </div>

                <div class="row">
                  <div class="col-sm-6 col-md-4">
                    <div class="thumbnail">
                         <h3>News</h3>
                      <img src="images/frontcover_250.jpg" alt="">
                      <div class="caption">

                        <p>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...
                      <a href="#" class="btn btn-primary" role="button">mehr</a> </p>
                      </div>
                    </div>
                  </div>
                </div>

                <div class="row">
                  <div class="col-sm-6 col-md-4">
                    <div class="thumbnail">
                        <h3>Facebook</h3>
                      <img src="http://www.placehold.it/300x200" alt="">
                      <div class="caption">

                        <p>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...
                        <a href="#" class="btn btn-primary" role="button">mehr</a> </p>
                      </div>
                    </div>
                  </div>
                </div>

                <div class="row">
                  <div class="col-sm-6 col-md-4">
                    <div class="thumbnail">
                         <h3>Bilder des letzen Auftrittes</h3>
                      <img src="http://www.placehold.it/300x200" alt="">
                      <div class="caption">

                        <p>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...
                        <a href="#" class="btn btn-primary" role="button">mehr</a> </p>
                      </div>
                    </div>
                  </div>
                </div>
            </div>

und noch die CSS

#master{
    text-align: center;
    margin-top: 50px;
}




.row{
    position: relative;
    margin-top: 0px;
    display: inline-block;
    border: solid #fff 2px;
    padding: 5px;
    margin: 10px;
    max-width: 310px;
    max-height: 600px;
    background-color: #000;
    opacity: 0.9;
}
.row p{ color: #fff;
    font-family: 'Cinzel', serif;
    text-shadow: #000 1px 1px;
    text-align: center;
}




h3{
    color: #fff;
    font-family: 'Cinzel', serif;
    text-shadow: #000 1px 1px;
    text-align: left;
    border-bottom: white solid 2px;
}
.caption{
    margin-top: 10px;
    width: 100%;
    border:solid white 1px;   
}

Hallo MrMurphy,

sorry für die ungenügende Beschreibung.

Ich versuche es nochmal zu erklären:

Ich möchte gerne in meine Website 4 blöcke debeneinander anzeigen wie auf dem Bild dargestellt einbauen.
Das funktioniert soweit ganz gut.
habe den Code per Bootstraps eingepflegt und hier fängt mein neues/altes Problem wieder an
Sobald ich ein Bild einfüge, verscheibt sich das gesamte DIV nach oben und verwendet den Punkt "margin-bottom" als Nullpunkt somit sind die gesamten DIV blöcke nicht mehr gleich groß und verschieben sich.
Werden jetzt aber Platzhalter von placehold.it verwendet, bleibt die gesamte Box so wie sie sein soll.

html-seminar.de/woltlab/attachment/903/
ist zustand

html-seminar.de/woltlab/attachment/902/
soll zustand

Meine frage:
Warum passiert das, bzw warum wird die vorgegeben höhe im css max-height:500px trotzdem überschritten ?

Hallo Leute,

habe folgenden Quellcode geschrieben und habe nun folgendes Problem

ich möchte gerne um jeden img Tag ein Div zaubern um unter dem Bild einen Text hineinschreiben.
Dies sollte sich danach auch responsiv verhalten.

mein Problem ist nun dass wenn ich einen DIV Tag um das element füge, die Datei sich nach oben verschiebt
und eig den Bottom als "Nullpunkt verwendet.

Kann mir da einer helfen ?

<div id="wrapper_home">        <div id="content">            <div id="row">                <div class="inhalt">                    <img src="images/flyer-fb_300px.jpg">                    <p>Hier sollte ein Text und ein <a href="#">Link </a>herkommen</p>                </div>                <div class="inhalt">                    <img src="images/flyer-fb_300px.jpg">                    <p>Auch hier soll der Text erscheinen mit einem <a href="#">Link</a>welcher nicht größer als die vorgegebene Box sein darf denn sonst wandert das Div in </p>                </div>                <div class="inhalt">                    <img src="images/flyer-fb_300px.jpg">                    <p>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. 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 <a href="#">LINK</a>gubergren, no sea takimata sanctus est Lorem ipsum dolor sit amet.</p>                </div>                    <img src="images/flyer-fb_300px.jpg">                </div>            </div>        </div>

und hier die dazugehörige css Datei

#content{height: auto;width: 100%;text-align: center;}.inhalt{width: 300px;height: 700px;display: inline-block;}

kann das sein dass ich hier irgendwas vergessen habe ? oder falsch geschrieben habe ??

Bitte um Hilfe MFG

habe es nun so gelöst

<div id="bg_wrap"></div>

und die dazugehörige CSS dabei

#bg_wrap {
z-index: -1;
position: fixed;
top: 0;
left: 0;
height: 100%;
width: 100%;
background-size: 100%;
background-image: url(../hg_img.jpg);
background-repeat: no-repeat;

und siehe da es klappt nun auch in den Mobilen Browsern.

Hallo Leute,

Habe eine Website erstellt wo ich ein Hintergrundbild in einen Div Container gestellt habe.
Das ding funktioniert. alles ok . auch im Responsivdesign.

Meine Frage ist nun:

Warum wird das Bild welches definitiv als Hintergrund existiert auf einem Smartphone nicht als

*/ background-attachment:fixed/*
angezeigt sondern scrollt mit ?

Habe auf meinem iPhone mit Chrome und Safari getestet und es funktioniert bei beiden nicht.

In den Desktopversionen funkt es ohne Probleme.

Hat hier jemand einen Lösungsansatz ?
Kann mir ein jQuery code weiterhelfen ?
Ist es Lösbar mit -webkit?

Vielen Dank für eure Hilfe

Mit freundlichen Grüßen
    

ok vielen dank für deine schnelle Antwort.

Dann muss ich da fast etwas falsch verstanden haben in meiner Ausbildung.

Ich verstehe dass die selben Klassen, ID, udgl. überschrieben werden.

Und wenn ich deine Aussage jetzt richtig verstehe, wird meine MAIN.css zwar für das Layout verwendet, und mit der nächsten spezial.css nur der von mir geforderte Inhalt geändert.
Ich werde mich sofort an die Arbeit machen und das ausprobieren.

Vielen Dank werde mein Feedback danach abgeben     

Hallo Leute,

habe da ein Problem und weiß nicht wirklich weiter.
ich bin gerade dabei eine Website zu erstellen, habe auch schon viele Code zeilen geschrieben, stehe aber jetzt vor einem für mich nahezu unlösbaren Problem.

Wie kann ich für jede einzelne Seite den css Stylesheet ändern ?
Ich habe auf allen Seiten das selbe Layout und möchte nur diverse Inhalte mit css ändern.
Gibt es denn da eine Möglichkeit vorhandenen css code einzubinden bzw mehrere verschiedene css Codes im Head Bereich mit einem <link> zu versehen ?

<link rel="stylesheet" type="text/css" href="css/main.css">
<link rel="stylesheet" type="text/css" href="css/special.css">

Soweit ich weiß, wird doch im css der letze Eintrag übernommen wobei mir ja dann die main.css überschrieben wird.

Frage:
Kopiere ich mir die gesamte Main.css in die spezial.css und schreibe einfach die nächsten stylesheets dazu oder gibt es da eine andere
Möglichkeit dies schneller und mit weniger Codierung durchzuführen ?

Irgendwann habe ich bei Hausnummer 50 Einzelseiten 10.000 Codezeilen.

das muss doch einfach gehen ?????

Vielen Dank für eure Hilfe

MFG