• Jetzt anmelden. Es dauert nur 2 Minuten und ist kostenlos!

ein weiteres Bild in die Galerie einfügen klappt nicht

Nes

Neues Mitglied
hallo,

habe eine hp erstellt und verstehe nicht was ich am code ändern muss, damit ein weiteres bild in der reihe gezeigt wird. Hier kann man es sehen http://www.nesrin.at/schmetterling.html

ein 4tes bild würde reinpassen und würde auch schöner aussehen. ABER nach dem 3ten bild wird das 4te in eine neue zeile gepackt.

Code:
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<script type="text/javascript" src="http://www.nesrin.at/lightbox/js/prototype.js"></script>
<script type="text/javascript" src="http://www.nesrin.at/lightbox/js/scriptaculous.js?load=effects"></script>
<script type="text/javascript" src="http://www.nesrin.at/lightbox/js/lightbox.js"></script>
<link rel="stylesheet" href="http://www.nesrin.at/lightbox/css/lightbox.css" type="text/css" media="screen" />
<title>Echte Schmetterlinge</title>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1" />
<link rel="stylesheet" type="text/css" href="http://www.nesrin.at/style.css" />
</head>
<body>
<div id="container">
  <div id="left">
    <h4>Menu</h4>
    <div id="navcontainer">
      <ul id="navlist">
        <li id="active"><a href="http://www.nesrin.at/index.html" id="current">Home</a></li>
        <li><a href="http://www.nesrin.at/ketten.html">Ketten</a></li>
        <li>usw. links</li>
      </ul>
    </div>
  </div>
<div id="right">
    <h1>Handmade with love</h1>
    <h2>Unique</h2>
        <p>test text usw.</p>
<a href="http://www.nesrin.at/gross/anhaenger 60.4.jpg" rel="lightbox[gruen]"><img src="http://www.nesrin.at/thumbnails/anhaenger 60.4kl.jpg"></a>
<a href="http://www.nesrin.at/gross/anhaenger 60.3.jpg" rel="lightbox[gruen]"></a>
<a href="http://www.nesrin.at/gross/anhaenger 60.2.jpg" rel="lightbox[gruen]"></a>
<a href="http://www.nesrin.at/gross/anhaenger 60.jpg" rel="lightbox[gruen]"></a>
<a href="http://www.nesrin.at/gross/anhaenger 60.5.jpg" rel="lightbox[gruen]"></a>
<a href="http://www.nesrin.at/gross/anhaenger 62.3.jpg" rel="lightbox[blau]"><img src="http://www.nesrin.at/thumbnails/anhaenger 62.3kl.jpg"></a>
<a href="http://www.nesrin.at/gross/anhaenger 62.4.jpg" rel="lightbox[blau]"></a>
<a href="http://www.nesrin.at/gross/anhaenger 62.5.jpg" rel="lightbox[blau]"></a>
<a href="http://www.nesrin.at/gross/anhaenger 62.jpg" rel="lightbox[blau]"></a>
<a href="http://www.nesrin.at/gross/anhaenger 62.2.jpg" rel="lightbox[blau]"></a>
<a href="http://www.nesrin.at/gross/anhaenger 62.1.jpg" rel="lightbox[blau]"></a>
<a href="http://www.nesrin.at/gross/anhaenger88e.jpg" rel="lightbox[orange]"><img src="http://www.nesrin.at/thumbnails/anhaenger88ekl.jpg"></a>
usw...
  </div>
</div>
<div id="footer">
  <p>Created by: Dieter Schneider 2007| <a href="http://www.csstemplateheaven.com">www.csstemplateheaven.com</a></p>
</div>
<div align=center>This template  downloaded form <a href='http://all-free-download.com/free-website-templates/'>free website templates</a></div></body>
</html>

weiß einer einen Rat?+
vielen dank
 
Ein 4. Bild würde nicht passen. Jedes Bild ist 149 Pixel breit, das mal 4 macht 596, aber das umgebende Element ist lediglich 590 Pixel breit. Du müsstest also das umgebende Element breiter machen.
 
hallo und vielen Dank!
wo genau siehst du die 590 px? ich habe es in der style.css gefunden und umgeändert in 597 aber es hat das ganze design zerschossen. So fortgeschritten bin ich leider nicht aber es muß doch irgendwie klappen. Muß ich hier vllt. noch zusätzlich andere Werte umändern?
Code:
/* CSS Document by Dieter Schneider 2006 | www.csstemplateheaven.com */

* {margin: 0;
  padding: 0;
}

body {
    background-image: url(http://www.nesrin.at/images/body_tile.jpg);
    background-repeat: repeat-y;
    font-size: 62.5%;
    font-family: Georgia, "Times New Roman", Times, serif;
}

#container {
    width: 954px;
    font-size: 1.2em;
}

#left {
    background-image: url(http://www.nesrin.at/images/left_bg.jpg);
    float: left;
    height: 434px;
    width: 274px;
    padding-top: 275px;
}

#right {
    background-image: url(http://www.nesrin.at/images/right_bg.jpg);
    float: left;
    width: 590px;
    padding-top:150px;
    padding-right: 90px;
    background-repeat: no-repeat;
}

#footer {
    background-image: url(http://www.nesrin.at/images/footer.jpg);
    background-repeat: no-repeat;
    height: 100px;
    width: 524px;
    padding-left: 430px;
    padding-top: 28px;
    clear: both;
}

#navcontainer { width: 150px; }

#navcontainer ul
{
margin-left: 55px;
list-style-type: none;
font-family: Arial, Helvetica, sans-serif;
}

#navcontainer a
{
display: block;
padding: 3px;
width: 160px;
}

#navcontainer a:link, #navlist a:visited
{
    color: #74752b;
    text-decoration: none;
    background-image: url(http://www.nesrin.at/images/bullet.png);
    background-repeat: no-repeat;
    padding-left: 25px;
    padding-bottom: 7px;
    font-weight: bolder;
}

#navcontainer a:hover
{
    color: #75492b;
    background-image: url(http://www.nesrin.at/images/bullet_hover.png);
    background-repeat: no-repeat;
}

p {margin-bottom: 15px;
  margin-top: 15px;}

h1 {
    text-align: center;
    margin-top: -55px;
    font-family: "Times New Roman", Times, serif;
    font-style: italic;
    color: #808D33;
    font-size: 2em;
}

h2 {
    text-align: center;
    margin-top: 7px;
    margin-bottom: 40px;
    font-family: "Times New Roman", Times, serif;
    font-style: italic;
    color: #9BA46D;
    font-size: 1.2em;
}

h3 {
    text-align: left;
    font-family: "Times New Roman", Times, serif;
    font-style: italic;
    color: #98A549;
    font-size: 1.5em;
}

h4 {
    text-align: left;
    font-family: "Times New Roman", Times, serif;
    font-style: italic;
    color: #808D33;
    font-size: 1.5em;
    margin-left: 107px;
    margin-bottom: 30px;
}

blockquote {
    font-style: italic;
    border: 1px dotted #98A549;
    padding-left: 15px;
    padding-right: 15px;
    margin-bottom: 15px;
    margin-top: 15px;
    color: #74752B;
  
}

a:link {color: #7C8832}
a:visited {color: #74752B}
a:hover {color: #993300}
a:active {color: #993300}
 
wo genau siehst du die 590 px?
Hallo??? Du wirst doch wohl nach einer 590 in der CSS-Datei suchen können, oder???

Ein Tipp: benutze den Firefox mit installiertem Addon Firebug. Damit kannst du solche Probleme finden und auch zum Testen im CSS ändern.
 
Ich glaube die 590 stehen nicht in der CSS-Datei. Ich habe diesen Wert einzig aus Firebug ausgelesen, wo man die Breite für einzelne Elemente angezeigt bekommt, auch wenn diese keine Breitenangabe im Style haben. Wie schon gesagt wäre Firebug für dich sicher hilfreich, wenn Du dein Problem genauer untersuchen und beheben willst.
 
Hallo??? Du wirst doch wohl nach einer 590 in der CSS-Datei suchen können, oder???
hallo??? ich schrieb doch daß ich 590 px in der css datei gefunden habe! und daß ich es in 597 px umgeändert habe, wo liegt das problem??

ich dachte man könnte mir hier sagen, welchen Wert ich ändern kann damit es funzt. Die 590 habe ich geändert, aber das ging ja nach hinten los. Also muß ich wohl noch ein Wert ändern. Wie ist das mit den padding-right gemeint? Ich werde mal den Wert ändern, mal sehen was sich tut. Ich muß ja nun leider wohl alle Werte nacheinander umändern, um mein Problem zu lösen. Leider sagt man mir nicht, welchen Wert ich ändern soll.
 
Also deine Styles und dein HTML ist gewöhungsbedürftig. Aber egal. Lass alles so wie es ist und füge diese Deklaration hinzu.
Code:
#right img {
width:145px;
}
Dann sollte es klappen. Zumindestens mit der FF Stilbearbeitung.
 
hallö
"Leider sagt man mir nicht, welchen Wert ich ändern soll."
glaube hast das mit dem Forum noch nicht ganz verstanden. dir wird nichts vorgekaut, sind ja nicht im Kindergarten.
Das ist ja ein fertiges template und da einfach die breite zu ändern ist nicht so einfach, da dann andere Sachen nicht passen können. also einfach die Bilder richtige große machen.
wenn deine Ski nicht ins Auto passen, zersegst das ja auch nicht.

cheffchen
 
Zurück
Oben