You are not logged in.

1

Tuesday, September 7th 2010, 7:52am

Wie den Text im 2. Div runter rutschen lassen

Guten Morgen,

Hab ein Problem mit 2 Divs und einem Image :P

ich hab ein Image:

und ein zweites:

Weiter hab ich eine Tabelle mit den beiden Divs:

HTML Code

1
2
3
4
5
6
7
8
9
10
11
....
<table width="100%" border="0" cellspacing="0" cellpadding="0">
          	  <tr>
          	     <td width="469" height="43" valign="top"><div id="content"><div class="content"><p>sdgsdgfhgfdfdgjdj</p>
          	     </div></div></td>
        	    </tr>
          	  <tr>
          	    <td style="width:469px;">&nbsp;</td>
        	    </tr>
        	  </table>
....


CSS:

Cascading Style Sheets

1
2
3
4
5
6
7
8
9
10
11
#content{
background:url(Bild1);
padding-top:160px;
background-repeat:no-repeat;
 
}
.content{
background:url(Bild2) repeat-y;
padding-left:60px;
 
}


Ich möchte jetzt erreichen das der Text um ca. 80px vom ersten Bild nach unten rutscht und das 2.te Bild im Hintergrund sixh an der y-Achse wiederholt.
Das erste ist nur im Hintergrund wegen dem oberen Teil der runden Ecken.

Warum das Image nicht anders aufteilen?
Geht nicht. Screen:

Möchte ja das der Text, im Screen weiter oben ist, als von oben ca. 80px nach unten.

Ich hab schon alles mögliche versucht, mit Z-Index, padding, margin etc

Aber bekomms nicht hin...

Hoffe ihr könnt mir da iwie helfen...

2

Friday, September 10th 2010, 9:39am

Hallo Freakli,

das sollte mit position:relative; und position:absolute; gelöst werden können.
Das <div>-Element, das den Text umschließt erhält ein position:relative; per CSS.
Das <p>-Element, das den Text beinhaltet, bekommt das position:absolute; und die beiden Eigenschaften top:80px; left:20px;
so ist der Text 80 Pixel von oben und 20 Pixel von Links positioniert.

Gruß, Uwe

3

Friday, September 10th 2010, 10:13am

Tabellen sind immer schlecht!
Dass Bild sollte sich eigentlich wiederholen...

Social bookmarks