mediengestalter.info
FAQ :: Mitgliederliste :: MGi Team

Willkommen auf dem Portal für Mediengestalter

Aktuelles Datum und Uhrzeit: Do 28.03.2024 22:44 Benutzername: Passwort: Auto-Login

Thema: Frage zum Padding vom 21.07.2008


Neues Thema eröffnen   Neue Antwort erstellen MGi Foren-Übersicht -> Allgemeines - Nonprint -> Frage zum Padding
Seite: Zurück  1, 2, 3  Weiter
Autor Nachricht
Kash

Dabei seit: 07.11.2002
Ort: Schopfheim
Alter: 41
Geschlecht: Männlich
Verfasst Mo 21.07.2008 18:18
Titel

Antworten mit Zitat Zum Seitenanfang

hast du das wirklich ausprobiert?
  View user's profile Private Nachricht senden
MarcelP
Threadersteller

Dabei seit: 15.07.2008
Ort: -
Alter: 30
Geschlecht: Männlich
Verfasst Mo 21.07.2008 18:22
Titel

Antworten mit Zitat Zum Seitenanfang

hab nur den ersten vorschlag von dir, bevor du den beitrag bearbeitet hast probiert

ok, da ich erst seit kurzem mit html arbeite, weiß ich leider nicht so genau was ein wrapper ist, geschweige denn wie man den benutzt... *hu hu huu*

kannst vllt. ganz kurz erklären wie ich das mache?

bist echt ne riesen hilfe für mich *Thumbs up!*


Zuletzt bearbeitet von MarcelP am Mo 21.07.2008 18:26, insgesamt 1-mal bearbeitet
  View user's profile Private Nachricht senden
Anzeige
Anzeige
Kash

Dabei seit: 07.11.2002
Ort: Schopfheim
Alter: 41
Geschlecht: Männlich
Verfasst Mo 21.07.2008 18:34
Titel

Antworten mit Zitat Zum Seitenanfang

CSS
Code:

* {

   margin: 0;

   padding: 0;

}

   

body {

   background:#ffffff;

}



html, body {

   margin:0;

   padding:0;

   height:100%;

}



.hidden {

   display:none;

}


div#wrapper {

   position: relative;

   margin:auto auto;

   width:800px;

   min-height: 100%;

   background:#cccccc;

}



/* IE - Hack */


* html div#wrapper {
   height:100%;

}


/* IE - Hack */

dein weiteres css
...



HTML
Code:

!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"
      "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">

<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en" lang="en">
<head>
   <meta http-equiv="Content-type" content="text/html; charset=ISO-8859-1" />
   <title></title>
   <meta http-equiv="Content-Language" content="de" />
   <meta http-equiv="imagetoolbar" content="no" />
   <meta name="MSSmartTagsPreventParsing" content="true" />
   <meta name="description" content="" />
   <meta name="keywords" content="" />
   <meta name="author" content="" />
   <style type="text/css" media="all">@import "css/deincssfile.css";</style>
</head>
<body>
<div id="wrapper">
  hier drinnen dein weitere sourcecode.
</div>
</body>
</html>
  View user's profile Private Nachricht senden
MarcelP
Threadersteller

Dabei seit: 15.07.2008
Ort: -
Alter: 30
Geschlecht: Männlich
Verfasst Mo 21.07.2008 19:19
Titel

Antworten mit Zitat Zum Seitenanfang

ok, entweder es funktioniert nicht oder ich bin echt ein hoffnungsloser fall:

weiß jetzt überhaupt nicht, wie ich meinen code umändern muss um es zu schaffen

tut mir echt leid falls ich nerve, bin halt erst seit ner woche mit html dran...


das ist jetzt die version, die mit deinen tipps überarbeitet wurde (warscheinlich 100% falsch *hu hu huu* )

Komplette version:

Code:
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8" />
<title>Peifer+Schulz</title>
<style type="text/css">
<!--
                  * {
                    margin:0;
                    padding:0;
                              }

                  html, body {
                    height:100%;
                                 }


body {
   background-image: url(Fertiges%20Logo.jpg);
   background-repeat: no-repeat;
   background-position:50% 50%;
   background-color: #4EA1AD;
}



a:link {
   color: #78B8C1;
   text-decoration: none;
}
a:visited {
   text-decoration: none;
   color: #78B8C1;
}
a:hover {
   text-decoration: none;
}
a:active {
   text-decoration: none;
}

 
#apDiv1 {                    /* Galerie */
   position:relative;
   margin:auto auto;
   left:248px;
   top:5px;
   width:441px;
   height:601px;
   z-index:1;
   background-color: #EAEAEA;
                     }
      
#apDiv1#wrapper {

   position: relative;

   margin:auto auto;


   width:800px;

   min-height: 100%;

   background:#cccccc;

}                                    
                              
                              
      * html apDiv1#wrapper {
   height:100%;                        
                              
                              
                              
                              
                              
                              
                              
-->
</style>
<script src="Scripts/AC_RunActiveContent.js" type="text/javascript"></script>
</head>

<body>
<div id="apDiv1">
  <script type="text/javascript">
AC_FL_RunContent( 'codebase','http://download.macromedia.com/pub/shockwave/cabs/flash/swflash.cab#version=9,0,28,0','width','447','height','600','src','Gallery','quality','high','pluginspage','http://www.adobe.com/shockwave/download/download.cgi?P1_Prod_Version=ShockwaveFlash','movie','Gallery' ); //end AC code
</script><noscript><object classid="clsid:D27CDB6E-AE6D-11cf-96B8-444553540000" codebase="http://download.macromedia.com/pub/shockwave/cabs/flash/swflash.cab#version=9,0,28,0" width="447" height="600">
    <param name="movie" value="Gallery.swf" />
    <param name="quality" value="high" />
    <embed src="Gallery.swf" quality="high" pluginspage="http://www.adobe.com/shockwave/download/download.cgi?P1_Prod_Version=ShockwaveFlash" type="application/x-shockwave-flash" width="447" height="600"></embed>
  </object>
</noscript></div>
</body>
</html>



apdiv1 muss auf die rechte seite des layouts (im video gezeigt)
der background ist 50% 50% positioniert, also genau in der mitte,
wenn ich die seite kliener/größer ziehe verändert sich der background , das div element bleibt vertikal an seiner position


Zuletzt bearbeitet von MarcelP am Mo 21.07.2008 19:36, insgesamt 2-mal bearbeitet
  View user's profile Private Nachricht senden
Kash

Dabei seit: 07.11.2002
Ort: Schopfheim
Alter: 41
Geschlecht: Männlich
Verfasst Mo 21.07.2008 19:34
Titel

Antworten mit Zitat Zum Seitenanfang

ja sorry das ich das sagen muß,
aber das ist wirklich nicht gut.

ich habe dir doch alles vorgegeben.

ich habe eigentlich keine lsut dir jetzt dein zeug zusammen zu basteln.
du mußt deinen div '#apDiv1' als kindelement des divs '#wrapper' anlegen.

d.h. im css file (egal ob eingebunden oder nicht) muß die deklaration nach dem wrapper erfolgen.
und im HTML file in dem div '#wrapper' sitzen

Code:

<div id="wrapper">
   <div id="apDiv1"></div>
</div>


Zuletzt bearbeitet von Kash am Mo 21.07.2008 19:39, insgesamt 1-mal bearbeitet
  View user's profile Private Nachricht senden
MarcelP
Threadersteller

Dabei seit: 15.07.2008
Ort: -
Alter: 30
Geschlecht: Männlich
Verfasst Mo 21.07.2008 19:39
Titel

Antworten mit Zitat Zum Seitenanfang

dann werd ich jetzt nochn paar mal probieren...

eine Frage:
muss ich den wrapper umbenennen und apdiv1 löschen?

dann versteh ich's vllt.




Kann ich vollkommen verstehen dass du mir nicht mehr helfen willst
Würd ich an deiner Stelle auch nicht mehr Lächel
Kein Problem, vielleicht klappts ja jetzt...

klappt leider nicht

trotzdem Vielen vielen dank


Zuletzt bearbeitet von MarcelP am Mo 21.07.2008 19:59, insgesamt 4-mal bearbeitet
  View user's profile Private Nachricht senden
nicoG

Dabei seit: 25.01.2006
Ort: Freiburg
Alter: -
Geschlecht: Männlich
Verfasst Mo 21.07.2008 20:29
Titel

Antworten mit Zitat Zum Seitenanfang

Moin Lächel

nicht so schnell den Kopf in den Sand stecken * Ja, ja, ja... *
Du solltest das Problem ganz anders angehen: Du hast ein Hintergrundbild. Das würde ich nicht dem body zuweisen, sondern einem div, dass du um deine ganze Seite legst (in dem Beispiel von Kash heißt dieser #wrapper, kann aber natürlich auch jeden anderen Namen tragen).
Nun hast du dieses Div und kannst das positionieren wie du willst, eben auch zentriert, wie anfänglich das Hintergrundbild.
Vorteil: Die restlichen Objekte, wie deine Flashgalerie kannst du leichter positionieren.
Kannst du mal dein Hintergrundbild herzeigen, damit man da schnell mal ein Beispiel machen kann. Ist ja keine komplizierte Sache, man muss das nur richtig angehen.

Ein Meister ist noch nicht vom Himmel gefallen, also keine Sorge, wenn du nach einer Woche noch nicht alles von HTML und CSS verstehst * Mmmh, lecker... *
Mach dich mal schlau in Sachen Vererbung und Positionierung in CSS *Thumbs up!*
http://www.css4you.de/wscss/css08.html
http://www.yaml.de/
http://blog.html.it/layoutgala/
etc, einfach schauen wies gemacht wurde *zwinker*
  View user's profile Private Nachricht senden
MarcelP
Threadersteller

Dabei seit: 15.07.2008
Ort: -
Alter: 30
Geschlecht: Männlich
Verfasst Mo 21.07.2008 23:36
Titel

Antworten mit Zitat Zum Seitenanfang

Hier das Hintergrundbild:

Foto bei Flickr


die Website ist halt noch im sehr frühen Anfangsstatus
auf die linke Seite nter das Logo kommt die Navigation, die ganz rechte hellblaue Spalte wir mit der Flashgalerie ausgefüllt, welche die gleichen Ausmaße wie die Spalte hat (und Hintergrundfarbe)
Dieses Layout wird in der Mitte der Site platziert und der hintergrund wird in dem Türkis des Logos gefärbt.

Also ich glaub ich hab jetzt auch verstanden was man da macht (ungefähr Lächel )
Ich bau also nen großen div container mit den ausmaßen der Hintergundgrafik und platziere in Kind-Elementen den Inhalt in diesem großen div tag und dan kann ich den großen container mittig ausrichten.

Richtig?


Zuletzt bearbeitet von MarcelP am Mo 21.07.2008 23:37, insgesamt 1-mal bearbeitet
  View user's profile Private Nachricht senden
 
Ähnliche Themen Padding von Listenpunkten setzt sich über allg. Padding
padding?
[CSS] padding-right?
div in div // problem mit padding
[solved] DIV und padding
Padding im NS4 - wie bzw. Alternativen?
Neues Thema eröffnen   Neue Antwort erstellen Seite: Zurück  1, 2, 3  Weiter
MGi Foren-Übersicht -> Allgemeines - Nonprint


Du kannst keine Beiträge in dieses Forum schreiben.
Du kannst auf Beiträge in diesem Forum nicht antworten.
Du kannst an Umfragen in diesem Forum nicht mitmachen.