Top-Themen

Aktuelle Themen (A bis Z)

Administrator.de FeedbackApache ServerAppleAssemblerAudioAusbildungAuslandBackupBasicBatch & ShellBenchmarksBibliotheken & ToolkitsBlogsCloud-DiensteClusterCMSCPU, RAM, MainboardsCSSC und C++DatenbankenDatenschutzDebianDigitiales FernsehenDNSDrucker und ScannerDSL, VDSLE-BooksE-BusinessE-MailEntwicklungErkennung und -AbwehrExchange ServerFestplatten, SSD, RaidFirewallFlatratesGoogle AndroidGrafikGrafikkarten & MonitoreGroupwareHardwareHosting & HousingHTMLHumor (lol)Hyper-VIconsIDE & EditorenInformationsdiensteInstallationInstant MessagingInternetInternet DomäneniOSISDN & AnaloganschlüsseiTunesJavaJavaScriptKiXtartKVMLAN, WAN, WirelessLinuxLinux DesktopLinux NetzwerkLinux ToolsLinux UserverwaltungLizenzierungMac OS XMicrosoftMicrosoft OfficeMikroTik RouterOSMonitoringMultimediaMultimedia & ZubehörNetzwerkeNetzwerkgrundlagenNetzwerkmanagementNetzwerkprotokolleNotebook & ZubehörNovell NetwareOff TopicOpenOffice, LibreOfficeOutlook & MailPapierkorbPascal und DelphiPeripheriegerätePerlPHPPythonRechtliche FragenRedHat, CentOS, FedoraRouter & RoutingSambaSAN, NAS, DASSchriftartenSchulung & TrainingSEOServerServer-HardwareSicherheitSicherheits-ToolsSicherheitsgrundlagenSolarisSonstige SystemeSoziale NetzwerkeSpeicherkartenStudentenjobs & PraktikumSuche ProjektpartnerSuseSwitche und HubsTipps & TricksTK-Netze & GeräteUbuntuUMTS, EDGE & GPRSUtilitiesVB for ApplicationsVerschlüsselung & ZertifikateVideo & StreamingViren und TrojanerVirtualisierungVisual StudioVmwareVoice over IPWebbrowserWebentwicklungWeiterbildungWindows 7Windows 8Windows 10Windows InstallationWindows MobileWindows NetzwerkWindows ServerWindows SystemdateienWindows ToolsWindows UpdateWindows UserverwaltungWindows VistaWindows XPXenserverXMLZusammenarbeit

gelöst Table umsteiger, Div abstände

Mitglied: 25521

25521 (Level 1)

09.09.2008, aktualisiert 10.09.2008, 3920 Aufrufe, 2 Kommentare

Hallo,

Zu erst einmal ein Bild um meine Frage besser zu beschreiben.
021de35d611900e4f16e45a519253616-seiten_problem - Klicke auf das Bild, um es zu vergrößern

Der Rote kasten ist ein TD in einer Table mit einer breite von 680 Pixeln.

Wie im Quelltext unten gezeigt, ist der Grüne Kasten ein DIV der neben einem Blauen kasten auch ein DIV liegt. Als Abstand vom rand muss ich 230 angeben, 200 der Blaue kasten ,15 sein Linker rand Abstand und die verbleibenden 15 sind der Abstand zwischen Blauem kasten und Grünem kasten.

Gibt es auch eine Möglichkeit nur den relativen Abstand zur rechten kante des Blauen Kastens anzugeben, also 15?

HTML Code
01.
<Div Class="Ueberschrift"> 
02.
  Linksammlung 
03.
</Div> 
04.
 
05.
<div style="background-color:#c0c0c0;height:1px;"></Div> 
06.
 
07.
<Div Class="InhaltzuUeberschrieft" style="float:left;margin-left:15px;width:200px;"> 
08.
	<FORM action=""><SELECT onchange="location = this.options[this.selectedIndex].value" style="width: 200px;" size="1"> 
09.
	<option selected value="/index.php?riu=linksamlung&amp;id1=0">Hauptkategorie:</option> 
10.
	<option value="/index.php?riu=linksamlung&amp;id1=1">Computer</option> 
11.
	</SELECT></form> 
12.
</Div> 
13.
 
14.
<Div Class="InhaltzuUeberschrieft" style="margin-left:230px;"> 
15.
	<FORM action=""><SELECT onchange="location = this.options[this.selectedIndex].value" style="width: 200px;" size="1"> 
16.
	<option selected value="/index.php?riu=linksamlung&amp;id1=0"></option> 
17.
	</SELECT></form> 
18.
</Div> 
19.
 
20.
<div Class="InhaltzuUeberschrieft" style="background-color:#c0c0c0;height:1px;clear:left;"></Div>
CSS Code
01.
.Ueberschrift { 
02.
              margin:5px; 
03.
              font-family:Arial,sans-serif; 
04.
              font-size:20px; 
05.
              font-weight:bold; 
06.
              color:black; 
07.
08.
 
09.
.InhaltzuUeberschrieft  { 
10.
                        margin-top:10px; 
11.
                        }
Mitglied: Arano
10.09.2008 um 02:05 Uhr
Nabend,

etwa so !? :
01.
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" 
02.
   "http://www.w3.org/TR/html4/strict.dtd"> 
03.
<html> 
04.
  <head> 
05.
    <style type="text/css"> 
06.
      <!-- 
07.
        #main  { border:1px solid #ff0000; width:680px; height:400px; margin:auto; padding-top:15px; } 
08.
        #blau  { border:1px solid #0000ff; width:200px; float:left; margin-left:15px; } 
09.
        #gruen { border:1px solid #00ff00; width:200px; float:left; margin-left:15px; } 
10.
        #other { border:1px solid #ffff00; width:200px; } 
11.
         
12.
        .floatstopper { clear:left; } 
13.
      --> 
14.
    </style> 
15.
  </head> 
16.
  <body> 
17.
   
18.
    <div id="main"> 
19.
     
20.
      <div id="blau"> 
21.
        blau 
22.
      </div> 
23.
     
24.
      <div id="gruen"> 
25.
        gr&uuml;n 
26.
      </div> 
27.
       
28.
      <span class="floatstopper">&nbsp;</span> 
29.
       
30.
      <div id="other"> 
31.
       other 
32.
      </div> 
33.
     
34.
    </div> 
35.
   
36.
  </body> 
37.
</html>
~Arano

(Habe es im Firefox gemacht, kann leider nicht sicher sagen wie es in den anderen aussieht !? )
Bitte warten ..
Mitglied: 25521
10.09.2008 um 14:33 Uhr
Hallo,

Danke mit deinem Code konnte ich mir Folgendes Bauen.

01.
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" 
02.
   "http://www.w3.org/TR/html4/strict.dtd"> 
03.
<html> 
04.
  <head> 
05.
    <style type="text/css"> 
06.
      <!-- 
07.
        #main  { border:1px solid #ff0000; width:680px; height:400px; margin:auto; } 
08.
        .td { border:1px solid #0000ff; width:auto; float:left; } 
09.
        .tr { clear:left; } 
10.
	.abstandHV { margin-top:15px; margin-left:15px; } 
11.
      --> 
12.
    </style> 
13.
  </head> 
14.
  <body> 
15.
   
16.
    <div id="main"> 
17.
     
18.
      <div class="tr td abstandHV"> 
19.
        Kasten NR.1 
20.
      </div> 
21.
     
22.
      <div class="td abstandHV"> 
23.
        Kasten NR.2 
24.
      </div> 
25.
 
26.
      <div class="td abstandHV"> 
27.
        Kasten NR.3 
28.
      </div> 
29.
 
30.
      <div class="td abstandHV"> 
31.
        Kasten NR.4 
32.
      </div> 
33.
 
34.
      <div class="tr td abstandHV"> 
35.
       Kasten NR.6 in neuer Zeile 
36.
      </div> 
37.
     
38.
    </div> 
39.
   
40.
  </body> 
41.
</html>
Ich denke mal damit kann man gut arbeiten. Werde es die tage einmal in der Seite testen.
Bitte warten ..
Ähnliche Inhalte
JavaScript

Abstand entfernen nach verschieben von div-Blöcken mit jQueryui position

Frage von bolshiJavaScript

Hallo, auf meiner Testsite werkelt ein jQuery-script, welches per ui.position bestimmte div's an die entsprechenden Stellen bringt: Link Testsite: ...

C und C++

Von C auf C++ umsteigen

Frage von jangruC und C++3 Kommentare

Sehr geehrte Community, wie Sie meiner Überschrift bereits entnehmen konnten, habe ich vor von C auf C umzusteigen. Da ...

Linux

Linux-News für Umsteiger

gelöst Frage von honeybeeLinux4 Kommentare

Hallo, ich bin seit Jahren ein Windows-Anwender und würde mich gern in Zukunft mehr mit Linux beschäftigen. Gibt es ...

Voice over IP

Meine Firma möchte auf VoIP umsteigen!

gelöst Frage von 113235Voice over IP23 Kommentare

Hallo, Meine Firma möchte auf VoIP umsteigen, kenne mich mit TK Anlagen nicht wirklich aus. Was sind die Voraussetzungen ...

Neue Wissensbeiträge
Windows 10

USB Maus und Tastatur versagen Dienst unter Windows 10

Erfahrungsbericht von hardykopff vor 1 TagWindows 105 Kommentare

Da steht man ziemlich dumm da, wenn der PC sich wegen fehlender USB Tastatur und Maus nicht bedienen lässt. ...

Administrator.de Feedback
Update der Seite: Alles zentriert
Information von Frank vor 2 TagenAdministrator.de Feedback18 Kommentare

Hallo User, die größte Änderung von Release 5.8 ist das Zentrieren der Webseite (auf großen Bildschirmen) und ein "Welcome"-Teaser ...

Humor (lol)

WhatsApp-Nachrichten endlich auch per Bluetooth versendbar

Information von BassFishFox vor 2 TagenHumor (lol)4 Kommentare

Genau darauf habe ich gewartet! ;-) Der beliebte Messaging-Dienst WhatsApp erhält eine praktische neue Funktion: Ab dem nächsten Update ...

Google Android

Googles "Android Enterprise Recommended" für Unternehmen

Information von kgborn vor 3 TagenGoogle Android3 Kommentare

Hier eine Information, die für Administratoren und Verantwortliche in Unternehmen, die für die Beschaffung und das Rollout von Android-Geräten ...

Heiß diskutierte Inhalte
Windows Server
Standortvernetzung zu einem Strato VServer (Windows)
Frage von matzefratze81Windows Server10 Kommentare

Moin, ich komme aus einem Enterprise-Umfeld und habe den Fehler gemacht, dass ich mich auf ein kleines Unternehmen eingelassen ...

Grafikkarten & Monitore
4k EIZO Monitor, Fernseher und Splitter
Frage von LerxxeyGrafikkarten & Monitore9 Kommentare

Hallo Zusammen, vielleicht könnt ihr mir bei einem Problem helfen wo ich einfach nicht mehr weiterkomme Und zwar haben ...

Router & Routing
WRT keine Verbindung zum Web Interface
Frage von ILeonardRouter & Routing9 Kommentare

Hallo, Ich habe einen TP-Link WR841n mit wrt geflasht, das Problem ist ich kann mich mit 192.168.1.1 nicht verbinden. ...

Humor (lol)
Nerd Zeitschrift gesucht
Frage von 2SeitenHumor (lol)6 Kommentare

Hey Zusammen, Ich suche eine Zeitschrift bei der es ums technische Basteln geht. Pc zusammenschrauben, Arduino Projekte, Server Tipps ...