externen php-file content per php nachladen

[einsiedler]

Hi MudGuard,

hier ein Schaubild:

Ich möchte die Bildergalerie die ich seperat (zur Anschauung!) im Ordner "Testseite4" habe, und prima funzt, in mein Code einbauen, und dann entsteht das CHAOS.....

siehe derzeit: DEMO-Webseite (ich habs mal so gelassen das man es sieht!)

<input type="radio" id="box1" name="nav" checked="checked" />   
<input type="radio" id="box2" name="nav"/>   
<input type="radio" id="box3" name="nav"/>  
<input type="radio" id="box4" name="nav"/>   
<input type="radio" id="box5" name="nav"/>
	<div id="foto_ausgabemodul_1">
		<figure>
			<img src="../fotos/floss_performance_muenster_web.jpg">
				<figcaption>"bunker" @ RTFM  - Kunsthalle M&uuml;nster, 2015</figcaption>
		</figure></div>

	<div id="foto_ausgabemodul_2">
		<figure>
			<img src="../fotos/palettenraum_muenster_web.jpg">
				<figcaption>"bunker" @ RTFM  - Kunsthalle M&uuml;nster, 2015</figcaption>
		</figure></div>

	<div id="foto_ausgabemodul_3">
		<figure>
			<img src="../fotos/der_bau_2_web.jpg">
				<figcaption>"bunker" @ RTFM  - Kunsthalle M&uuml;nster, 2015</figcaption>
		</figure></div>

	<div id="foto_ausgabemodul_4">
		<figure>
			<img src="../fotos/20150409_020705_web_klein.jpg">
				<figcaption>"bunker" @ RTFM  - Kunsthalle M&uuml;nster, 2015</figcaption>
		</figure></div>

	<div id="foto_ausgabemodul_5">
		<figure>
			<img src="../fotos/marta_herford_web.jpg">
				<figcaption>"bunker" @ RTFM  - Kunsthalle M&uuml;nster, 2015</figcaption>
		</figure></div>

	<div class="holder">
		<label for="box1"><div class="switch" id="eins" ></div></label>
		<label for="box2"><div class="switch" id="zwei" ></div></label>
		<label for="box3"><div class="switch" id="drei" ></div></label>
		<label for="box4"><div class="switch" id="vier" ></div></label>
		<label for="box5"><div class="switch" id="fünf" ></div></label>
	</div>

Das hier habe ich seite1.php genannt.......

seite2.php / seite3.php sind so ähnlich... mal mehr mal weniger fotos......

seite1.php / seite2.php / seite3.php und alle weiteren werden von der hauptindex.php datei nachgeladen........ mit "inlude_once..." ......

und DA liegt villeicht der HAKEN... das die Fotos nicht angezeigt werden, sehe ich das richtig?

hier könnt ihr euch das anschauen..... : DEMO-webseite

Wo liegt da der Fehler...

hier noch die fotogalerie_style.css vom ganzen....

@charset "utf-8";
/* CSS Document */


input#box1, input#box2,input#box3,input#box4,input#box5 {
    display: none;
}
label { cursor: pointer }
#foto_ausgabemodul {
 position: relative;
  width: 45.5vw;
  height: 34vw;
  overflow: hidden;
  margin: 0 auto;
  border: 2px dotted red;
}
#foto_ausgabemodul .switch {
  position: relative;
  left:1vw ;
  height: 1vw;
  width: 1vw;
  float: left;
  color: rgba(0,0,0,0.6);
   -webkit-transition: 0.5s;
       -moz-transition: 0.5s;
        -ms-transition: 0.5s;
         -o-transition: 0.5s;
            transition: 0.5s;
}
#foto_ausgabemodul .switch:hover {
  opacity: 1;
    -webkit-transition: 0.5s;
       -moz-transition: 0.5s;
        -ms-transition: 0.5s;
         -o-transition: 0.5s;
            transition: 0.5s;
}
#foto_ausgabemodul .holder {
  position: relative;
  width: 5vw;
  border: 1px dotted orange;
}
#foto_ausgabemodul_1 img,
#foto_ausgabemodul_2 img,
#foto_ausgabemodul_3 img,
#foto_ausgabemodul_4 img,
#foto_ausgabemodul_5 img  {
  position: absolute;
  top: 0;
  left: 4.5vw;
  opacity: 0;
     -webkit-transition: 0.5s;
       -moz-transition: 0.5s;
        -ms-transition: 0.5s;
         -o-transition: 0.5s;
            transition: 0.5s;
}
#foto_ausgabemodul #box1:checked ~ div#foto_ausgabemodul_1  img,#foto_ausgabemodul #box2:checked ~ div#foto_ausgabemodul_2 img, 
#foto_ausgabemodul #box3:checked ~ div#foto_ausgabemodul_3 img,#foto_ausgabemodul #box4:checked ~ div#foto_ausgabemodul_4 img, 
#foto_ausgabemodul #box5:checked ~ div#foto_ausgabemodul_5 img   {
    opacity: 1;
     -webkit-transition: 0.5s;
       -moz-transition: 0.5s;
        -ms-transition: 0.5s;
         -o-transition: 0.5s;
            transition: 0.5s;
}

#foto_ausgabemodul #box1:checked ~ div { margin-left: 0px }
#foto_ausgabemodul #box2:checked ~ div { margin-left: -1vw }
#foto_ausgabemodul #box3:checked ~ div { margin-left: -2vw }
#foto_ausgabemodul #box4:checked ~ div { margin-left: -3vw }
#foto_ausgabemodul #box5:checked ~ div { margin-left: -4vw }

#box1:checked ~ div #zwei::after {
  top: 31vw;
  left: 40vw;
  position: absolute;
  display: block;
  font-size: 2.5vw;
  content:">>";
  z-index: 2;
}

#box2:checked ~ div #eins::before {
  top: 31vw;
  left: 0.5vw;
  position: absolute;
  display: block;
  font-size: 2.5vw;
  content:"<<";
  z-index: 2;
}
#box2:checked ~ div #drei::after {
  top: 31vw;
  left: 40vw;
  position: absolute;
  display: block;
  font-size: 2.5vw;
  content:">>";
  z-index: 2;
}
#box3:checked ~ div #zwei::before {
  top: 31vw;
  left: 0.5vw;
  position: absolute;
  display: block;
  font-size: 2.5vw;
  content:"<<";
  z-index: 2;
}
#box3:checked ~ div #vier::after {
  top: 31vw;
  left:40vw;
  position: absolute;
  display: block;
  font-size: 2.5vw;
  content:">>";
  z-index: 2;
}
#box4:checked ~ div #drei::before {
  top: 31vw;
  left: 0.5vw;
  position: absolute;
  display: block;
  font-size: 2.5vw;
  content:"<<";
  z-index: 2;
}
#box4:checked ~ div #fünf::after {
  top: 31vw;
  left:40vw;
 position: absolute;
  display: block;
  font-size: 2.5vw;
  content:">>";
  z-index: 2;
}
#box5:checked ~ div #vier::before {
  top: 31vw;
  left: 0.5vw;
 position: absolute;
  display: block;
  font-size: 2.5vw;
  content:"<<";
  z-index: 2;
}

abgesehen davon das die Positionierung absolut verrutscht und sch.....e ist..... die Positionierung mit position: relative; und position absolute; muss ich sowiso ändern in meinem flexbox-system, sodass die Bildergalerie wie gewünscht im div "foto_ausgabemodul" eingestellt wird! (Da auch meine Frage, wie mache ich das am besten?)

Fragen über Fragen

und seufZ