Praktikant123
Mitglied
Hallo,
ich bin dabei eine Seite zu erstellen, auf der PDF's angezeigt werden sollen. Dabei befinden sich auf der linken Seite der Oberfläche die Links und rechts soll dann eine Vorschau erzeugt werden.
Danke an alle, die mir dabei geholfen haben.
Nun habe ich das problem, dass bei der Erstellung der Vorschau sich die Boxen verschieben. Wie kann ich am besten ein starres Layout erzeugen, sodass sich beim Vergrößern und Verklienern der Webseite (habe schon Bootstrap integriert) die PDF-Vorschau mit verändert und an ihrem Platz rechts auf der Seite bleibt?
Mein CSS:
Also links ist ein div und rechts, wobei das Rechte mit "#pdf" angesprochen wird.
".pdfobject-container" ist das Feld, was aufploppt, wenn man auf einen Link drückt.
Dieser soll rechts dargestellt werden und sich nicht verschieben.
M.f.G.
ich bin dabei eine Seite zu erstellen, auf der PDF's angezeigt werden sollen. Dabei befinden sich auf der linken Seite der Oberfläche die Links und rechts soll dann eine Vorschau erzeugt werden.
Danke an alle, die mir dabei geholfen haben.
Nun habe ich das problem, dass bei der Erstellung der Vorschau sich die Boxen verschieben. Wie kann ich am besten ein starres Layout erzeugen, sodass sich beim Vergrößern und Verklienern der Webseite (habe schon Bootstrap integriert) die PDF-Vorschau mit verändert und an ihrem Platz rechts auf der Seite bleibt?
Mein CSS:
Code:
/*NavigationLinks-----------------------------------*/
div#left {
float:left;
width:40%;
padding-top:5px;
padding-left: 10px;
padding-right: 10px;
padding-bottom:10px;
background-color:#FF8700;
overflow:auto;
align:top;
}
a {
text-decoration:none;
color: black;
}
ul, li {
list-style: none;
}
#nav li {
padding: 2px 2px 2px 15px;
cursor: default;
}
#nav ul {
display: none;
background: url(img/dots.png) repeat-y scroll 10px 0 transparent;
}
#nav li.expand {
background: url(img/arrow-down.gif) no-repeat scroll 0px 12px transparent;
}
.expanded {
background: url(img/arrow-up.gif) no-repeat scroll 0px 12px transparent !important;
}
/*Überschrift Home-----------------------------------*/
#home
{
font-size: 20px;
vertical-align: bottom;
border-bottom: 2px solid #F6F1F1;
}
/*PDFObject-----------------------------------*/
#pdf {
float:right;
width:60%;
}
.pdfobject-container {
width: 100%;
max-width: 600px;
height: 600px;
margin: 2em 0;
}
.pdfobject { border: solid 1px #666; }
#results { padding: 1rem; }
.hidden { display: none; }
.success { color: #4F8A10; background-color: #DFF2BF; }
.fail { color: #D8000C; background-color: #FFBABA; }
Also links ist ein div und rechts, wobei das Rechte mit "#pdf" angesprochen wird.
".pdfobject-container" ist das Feld, was aufploppt, wenn man auf einen Link drückt.
Dieser soll rechts dargestellt werden und sich nicht verschieben.
M.f.G.
Anhänge
Zuletzt bearbeitet: