• 13.07.2025, 01:22
  • Registrieren
  • Anmelden

  • Sie sind nicht angemeldet.

 

DIV Positionierungsproblem

Lieber Besucher, herzlich willkommen bei: Aqua Computer Forum. Falls dies Ihr erster Besuch auf dieser Seite ist, lesen Sie sich bitte die Hilfe durch. Dort wird Ihnen die Bedienung dieser Seite näher erläutert. Darüber hinaus sollten Sie sich registrieren, um alle Funktionen dieser Seite nutzen zu können. Benutzen Sie das Registrierungsformular, um sich zu registrieren oder informieren Sie sich ausführlich über den Registrierungsvorgang. Falls Sie sich bereits zu einem früheren Zeitpunkt registriert haben, können Sie sich hier anmelden.

TrOuble

God

DIV Positionierungsproblem

Dienstag, 8. Februar 2005, 01:03

Moin,

Und mal ein Problem vom Trouble (achtung wortwitz ...)

Also, nachdem ich einen nette einleitung/diskussion über css mit Yogi hatte, wollte ich mir das nun auch aneignen und in meinem neusten projekt einbauen.

Allerdings habe ich ein problem mit der positionierung der divs ...

Also ich möchte folgendes :
4 div layer die eine relative position haben zu der tabelle, in der sie sind.

Allerdings geht das bei mir nicht - wenn dann sind sie UNTER einander, sie sollen aber nebeneinander sein ...

Und absolut kommt für mich auch nicht in frage, da die Dinger also Content benutz werden sollen -> somit IM layout nicht auf dem layout sein sollen ;)

Also her der Quellcode für die index :

Quellcode

 
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"
"[url]http://www.w3.org/TR/html4/loose.dtd">[/url]
<html>
<head>
<title>www.city-djs.de</title>
<link rel="stylesheet" type="text/css" href="main.css">
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1">
</head>
<body> 
<table cellpadding="0" cellspacing="0" id="full"> 
  <tr> 
    <td><table cellpadding="0" cellspacing="0" id="header"> 
        <tr> 
          <td height="174"><div align="center"><img src="images/logo.gif" alt="" width="717" height="174" border="0"></div></td> 
        </tr> 
      </table></td> 
  </tr> 
  <tr> 
    <td><table cellpadding="0" cellspacing="0" id="header_ubergang"> 
        <tr> 
          <td></td> 
        </tr> 
      </table> 
      <table align="center" cellpadding="0" cellspacing="0" id="content"> 
        <tr> 
          <td><img src="images/content_oben.gif" alt="" width="970" height="21"></td> 
        </tr> 
        <tr> 
          <td>
          <div id="table1">Content for id "table1" Goes Here</div>
              <div id="table2">Content for id "table2" Goes Here</div>
              <div id="table3">Content for id "table3" Goes Here</div>
              <div id="table4">Content for id "table4" Goes Here</div></td></tr> 
        <tr> 
          <td><img src="images/content_unten.gif" alt="" width="970" height="24"></td> 
        </tr> 
      </table></td> 
  </tr> 
</table> 
</body>
</html>

(diesma w3c valid ;))

Und hier der code aus der *.css datei :

Quellcode

 
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85

body {
      background: #A2A2A2;
      margin-left: 0px;
      margin-top: 0px;
      margin-right: 0px;
      margin-bottom: 0px;
}

#header {
background-image:url(images/logo_strecken.gif);
width:100%;  
height: 174px;
border:0;
}

#header_ubergang{
background-image:url(images/ueberganz.gif);
width:100%;
height: 75px;
border:0;
}

#content {
background:#D4D4D4;
width:970px;
border:0;
vertical-align: bottom;
overflow: visible;
font-family:Verdana, Arial, Helvetica, sans-serif;
font-size:12px;
}

#full {
background:#A2A2A2;
width:100%;  
border:0;
}
#table1 {
width:140px;
height:300px;

position:relative;
left:0px; top:0px;

border:1;
border-style:dashed;
border-color:#FF0000;
border-width:1px;
}
#table2 {
width:430px;
height:300px;

position:relative;
left:150px; top:0px;

border:1;
border-style:dashed;
border-color:#FF0000;
border-width:1px;
}
#table3 {
width:160px;
height:300px;

position:relative;
left:590px; top:0px;

border:1;
border-style:dashed;
border-color:#FF0000;
border-width:1px;
}
#table4 {
width:210px;
height:300px;

position:relative;
left:760px; top:0px;

border:1;
border-style:dashed;
border-color:#FF0000;
border-width:1px;
}


MfG TrOuble

crushcoder

God

Re: DIV Positionierungsproblem

Dienstag, 8. Februar 2005, 01:18

wg. nebeneinander:
schau dir mal "float:left; float:right; clear:both;" an.

Zitat von »Microsoft-Sprecher Thomas Baumgärtner«

Gott hat die Welt ja nur in sieben Tagen erschaffen können, weil es keine installierte Basis gab.

TrOuble

God

Re: DIV Positionierungsproblem

Dienstag, 8. Februar 2005, 01:21

Moin,

Hab sie grad mit float:left; hinbekommen, allerdings sollen zwischen den einzelnen divs 10px abstand sein - der ist aber nicht da...

crushcoder

God

Re: DIV Positionierungsproblem

Dienstag, 8. Februar 2005, 01:30

wenn der css-code noch so aussieht wie oben würd ich den divs mal ein "margin-right:10px;" geben.

edit: <div align="center"> solltest du in eine css-eigenschaft ändern, "text-align:center;" ist da besser.

Zitat von »Microsoft-Sprecher Thomas Baumgärtner«

Gott hat die Welt ja nur in sieben Tagen erschaffen können, weil es keine installierte Basis gab.

Y0Gi

God

Re: DIV Positionierungsproblem

Dienstag, 8. Februar 2005, 14:15

das mit dem float stand auch alles schön in dem link (http://glish.com/css/) den ich dir neulich geschickt hab ::)

wenn du zwischen den divs abstand willst, benutz margin. dafür issas ja.
This is my sick nature. – NorthCon // LANresort Bispingen // BYCEPS (LAN party software platform) // OrgaTalk (LAN party orga board)