Anzeige

DIV zentrieren

DIV zentrieren | PSD-Tutorials.de

Erstellt von Joernsen, 02.07.2009.

  1. Joernsen

    Joernsen Noch nicht viel geschrieben

    Dabei seit:
    23.04.2007
    Beiträge:
    24
    Geschlecht:
    männlich
    DIV zentrieren
    Hallo,
    ich habe leider ein häufiges Problem. Onkel Google hat mir auch viel ausgespukt und ich habe viele Möglichkeiten ausprobiert, aber bei mir funktioniert das Zentrieren einfach nicht. Kann mir jemand bei meinen Script helfen, da ich schon jede Hoffnung verloren habe. :(
    Danke.

     
    #1      
  2. stiller47

    stiller47 Tut nur so als ob

    11
    Dabei seit:
    19.05.2007
    Beiträge:
    1.177
    Geschlecht:
    männlich
    Ort:
    NRW
    Software:
    Creative Suite Standard CS4, Lightroom 2
    Kameratyp:
    Nikon D70
    DIV zentrieren
    AW: DIV zentrieren

    Jetzt sollte der DIV zentriert sein
     
    #2      
  3. anoX

    anoX Nicht mehr ganz neu hier

    Dabei seit:
    28.06.2009
    Beiträge:
    136
    Geschlecht:
    weiblich
    Ort:
    Ruhrgebiet
    Software:
    CS6, C4D
    DIV zentrieren
    AW: DIV zentrieren

    Davon ab, dass der Code der Hölle gleicht:

    Du musst ein Div erstellen und es um dein ganzes Wirrwarr legen. Dazu gib dem body das center mit. Geänderte bzw. fehlende Angaben sind im Code markiert:

    Code (Text):
    1.  
    2. <html xmlns="XHTML namespace">
    3. <head>
    4. <title>Spass im Bild</title>
    5. <meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1" />
    6.  
    7. <style type="text/css">
    8. <!--
    9.  
    10. [COLOR=DarkOrchid]body {
    11.  text-align:center;
    12. }
    13.  
    14. div#container {
    15.  margin:0 auto;
    16.  position:relative;
    17.  width:955px;
    18. }[/COLOR]
    19.  
    20. #Tabelle_01 {
    21. position:absolute;
    22. left:0px;
    23. top:0px;
    24. width:995px;
    25. height:596px;
    26. }
    27. #index2-01_ {
    28. position:absolute;
    29. left:0px;
    30. top:0px;
    31. width:995px;
    32. height:16px;
    33. }
    34. #index2-02_ {
    35. position:absolute;
    36. left:0px;
    37. top:16px;
    38. width:15px;
    39. height:580px;
    40. }
    41. #logo_ {
    42. position:absolute;
    43. left:15px;
    44. top:16px;
    45. width:255px;
    46. height:89px;
    47. }
    48. #index2-04_ {
    49. position:absolute;
    50. left:270px;
    51. top:16px;
    52. width:15px;
    53. height:580px;
    54. }
    55. #home-button_ {
    56. position:absolute;
    57. left:285px;
    58. top:16px;
    59. width:120px;
    60. height:89px;
    61. }
    62. #index2-06_ {
    63. position:absolute;
    64. left:405px;
    65. top:16px;
    66. width:15px;
    67. height:104px;
    68. }
    69. #service-but_ {
    70. position:absolute;
    71. left:420px;
    72. top:16px;
    73. width:120px;
    74. height:89px;
    75. }
    76. #index2-08_ {
    77. position:absolute;
    78. left:540px;
    79. top:16px;
    80. width:15px;
    81. height:104px;
    82. }
    83. #kontakt-butt_ {
    84. position:absolute;
    85. left:555px;
    86. top:16px;
    87. width:120px;
    88. height:89px;
    89. }
    90. #index2-10_ {
    91. position:absolute;
    92. left:675px;
    93. top:16px;
    94. width:15px;
    95. height:104px;
    96. }
    97. #gxe4stebuch-butt_ {
    98. position:absolute;
    99. left:690px;
    100. top:16px;
    101. width:120px;
    102. height:89px;
    103. }
    104. #index2-12_ {
    105. position:absolute;
    106. left:810px;
    107. top:16px;
    108. width:185px;
    109. height:89px;
    110. }
    111. #index2-13_ {
    112. position:absolute;
    113. left:15px;
    114. top:105px;
    115. width:255px;
    116. height:16px;
    117. }
    118. #index2-14_ {
    119. position:absolute;
    120. left:285px;
    121. top:105px;
    122. width:120px;
    123. height:15px;
    124. }
    125. #index2-15_ {
    126. position:absolute;
    127. left:420px;
    128. top:105px;
    129. width:120px;
    130. height:15px;
    131. }
    132. #index2-16_ {
    133. position:absolute;
    134. left:555px;
    135. top:105px;
    136. width:120px;
    137. height:15px;
    138. }
    139. #index2-17_ {
    140. position:absolute;
    141. left:690px;
    142. top:105px;
    143. width:305px;
    144. height:15px;
    145. }
    146. #inhalt-index2_ {
    147. position:absolute;
    148. left:285px;
    149. top:120px;
    150. width:525px;
    151. height:476px;
    152. }
    153. #index2-19_ {
    154. position:absolute;
    155. left:810px;
    156. top:120px;
    157. width:1px;
    158. height:476px;
    159. }
    160. #rechts-index2_ {
    161. position:absolute;
    162. left:811px;
    163. top:120px;
    164. width:155px;
    165. height:476px;
    166. }
    167. #index2-21_ {
    168. position:absolute;
    169. left:966px;
    170. top:120px;
    171. width:29px;
    172. height:476px;
    173. }
    174. #index2-22_ {
    175. position:absolute;
    176. left:15px;
    177. top:121px;
    178. width:255px;
    179. height:475px;
    180. }
    181. -->
    182. </style>
    183. </head>
    184.  
    185. <body style="background-color:#FFFFFF;" >
    186. [COLOR=DarkOrchid]<div id="container">[/COLOR]
    187. <div style="text-align: center">
    188. <div style="width: 200px; margin: 0px auto">
    189. Hallo Welt
    190. </div>
    191. </div>
    192.  
    193. <table width="90%" border="0" text-align="center">
    194. <tr>
    195. <td>
    196. <div id="Tabelle_01">
    197. <div id="index2-01_"> <img id="index2_01" src="Bilder/index2_01.jpg" width="995" height="16" alt="" /> </div>
    198. <div id="index2-02_"> <img id="index2_02" src="Bilder/index2_02.jpg" width="15" height="580" alt="" /> </div>
    199. <div id="logo_"> <a href="index.html"
    200. onmouseover="window.status='HOME'; return true;"
    201. onmouseout="window.status=''; return true;"> <img id="logo" src="Bilder/logo.jpg" width="255" height="89" border="0" alt="HOME" /></a> </div>
    202. <div id="index2-04_"> <img id="index2_04" src="Bilder/index2_04.jpg" width="15" height="580" alt="" /> </div>
    203. <div id="home-button_"> <a href="index2.html"> <img id="home_button" src="Bilder/home_button.jpg" width="120" height="89" border="0" alt="" /></a> </div>
    204. <div id="index2-06_"> <img id="index2_06" src="Bilder/index2_06.jpg" width="15" height="104" alt="" /> </div>
    205. <div id="service-but_"> <a href="service.html"> <img id="service_but" src="Bilder/service_but.jpg" width="120" height="89" border="0" alt="" /></a> </div>
    206. <div id="index2-08_"> <img id="index2_08" src="Bilder/index2_08.jpg" width="15" height="104" alt="" /> </div>
    207. <div id="kontakt-butt_"> <a href="kontakt.html"> <img id="kontakt_butt" src="Bilder/kontakt_butt.jpg" width="120" height="89" border="0" alt="" /></a> </div>
    208. <div id="index2-10_"> <img id="index2_10" src="Bilder/index2_10.jpg" width="15" height="104" alt="" /> </div>
    209. <div id="gxe4stebuch-butt_"> <a href="g&auml;stebuch.html"> <img id="gxe4stebuch_butt" src="Bilder/g&auml;stebuch_butt.jpg" width="120" height="89" border="0" alt="" /></a> </div>
    210. <div id="index2-12_"> <img id="index2_12" src="Bilder/index2_12.jpg" width="185" height="89" alt="" /> </div>
    211. <div id="index2-13_"> <img id="index2_13" src="Bilder/index2_13.jpg" width="255" height="16" alt="" /> </div>
    212. <div id="index2-14_"> <img id="index2_14" src="Bilder/index2_14.jpg" width="120" height="15" alt="" /> </div>
    213. <div id="index2-15_"> <img id="index2_15" src="Bilder/index2_15.jpg" width="120" height="15" alt="" /> </div>
    214. <div id="index2-16_"> <img id="index2_16" src="Bilder/index2_16.jpg" width="120" height="15" alt="" /> </div>
    215. <div id="index2-17_"> <img id="index2_17" src="Bilder/index2_17.jpg" width="305" height="15" alt="" /> </div>
    216. <div id="inhalt-index2_"> <img id="inhalt_index2" src="Bilder/inhalt_index2.jpg" width="525" height="476" alt="" /> </div>
    217. <div id="index2-19_"> <img id="index2_19" src="Bilder/index2_19.jpg" width="1" height="476" alt="" /> </div>
    218. <div id="rechts-index2_"> <img id="rechts_index2" src="Bilder/rechts_index2.jpg" width="155" height="476" alt="" /> </div>
    219. <div id="index2-21_"> <img id="index2_21" src="Bilder/index2_21.jpg" width="29" height="476" alt="" /> </div>
    220. <div id="index2-22_"> <img id="index2_22" src="Bilder/index2_22.jpg" width="255" height="475" alt="" /> </div>
    221. </div>
    222. </td>
    223. </tr>
    224. </table>
    225. [COLOR=DarkOrchid]</div>[/COLOR]
    226. </body>
    227. </html>
    228.  
     
    #3      
  4. Joernsen

    Joernsen Noch nicht viel geschrieben

    Dabei seit:
    23.04.2007
    Beiträge:
    24
    Geschlecht:
    männlich
    DIV zentrieren
    AW: DIV zentrieren

    Ihr seit Spitze. Danke für die schnelle Antworten, so schnell hätte ich nicht gerechnet. Und ich habe gestern den halben Tag dafür verschwendet, das richtige zu finden und hier hat es nur paar Minuten gedauert.
    Ja, ich weiß das der Code ziemlich heftig ist. Photoshop hat diesen selbst generiert. Nochmals danke.
     
    #4      
x
×
×