Anfängerfragen

Post by **sCion** » Thu 6. Jan 2011, 15:55

probiere

<div style="background-color: #FFFFFF; opacity: 0.5; heigth: 40px; width: 87px;float:left;">
      <h2 style="text-align: center; font-size: 20px">test</h2>
    </div>
    <div style="background-color: #FFFFFF; opacity:0.5;heigth: 40px; width: 87px; margin-left: 89px; margin-top: 0px;float:left;">
      <h2 style="text-align: center; font-size: 20px">test2</h2>
    </div>

badanation · Post by **badanation** » Thu 6. Jan 2011, 16:03

Von Frank geschrieben:
Oder lege es in CSS Regeln fest. Ist übersichtlicher!

Code: Select all

<html>
<head>
<style type="text/css">
.test1 {
  height: 40px;
  width: 87px;
  text-align: center;
  position: absolute;
  background-color: #FFFFFF;
  font-size: 20px;
  opacity: 0.5;
}
.test2 {
  height: 40px;
  width: 87px;
  left: 89px;
  text-align: center;
  position: absolute;
  background-color: #FFFFFF;
  font-size: 20px;
  opacity: 0.5;
}
</style>
</head>
<body>
<div>
<h1 class="test1">test</h1>
<h1 class="test2">test2</h1>
</div>
</body>
</html>

badanation · Post by **badanation** » Thu 6. Jan 2011, 16:14

Von NiickIF geschrieben:
danke an euch beide
aber:

sCion: bei dir stehen die beiden Kästchen weit auseinander sodass das 2te in der mitte des bildes ist...
Frank: bei deinem Lösungsvorschlag übernimmt er i-wie die größe der Kästchen und die Schriftgröße nicht.... die kästchen sind viel zu groß und die schrift zu klein....
Edit: und die kästchen überlappen sich....

Post by **sCion** » Thu 6. Jan 2011, 16:20

Dann setz um mein noch ein divcontainer der eine maximal breite von X hat die sich aus A+B (die beiden Boxen)+C (einen Abstand ergeben)Edit: Kann auch sein, dass es an deinem Abstand von 89px liegt. Weiß ja nicht wo du grad testest... aber aufm Wave wird der abstand automatisch kleiner da du ja nur 480px zur verfügung hast ;)Vorschau:http://www.scione-music.de/dls/wave-test.html

badanation · Post by **badanation** » Thu 6. Jan 2011, 16:24

Von Frank geschrieben:

NiickIF wrote:Frank: bei deinem Lösungsvorschlag übernimmt er i-wie die größe der Kästchen und die Schriftgröße nicht.... die kästchen sind viel zu groß und die schrift zu klein....
Edit: und die kästchen überlappen sich....

Stimmt... WebKit hab ich nicht probiert gehabt.

Probier nochmal so:

Code: Select all

<html>
<head>
<style type="text/css">
* { 
  margin:0; 
  padding:0; 
  borderwidth:0; 
}
.test1 {
  height: 40px;
  width: 87px;
  text-align: center;
  position: absolute;
  background-color: #FFFFFF;
  font-size: 20px;
  opacity: 0.5;
}
.test2 {
  height: 40px;
  width: 87px;
  left: 89px;
  text-align: center;
  position: absolute;
  background-color: #FFFFFF;
  font-size: 30px;
  opacity: 0.5;
}
</style>
</head>
<body>
<div>
<h1 class="test1">test</h1>
<h1 class="test2">test2</h1>
</div>
</body>
</html>

badanation · Post by **badanation** » Thu 6. Jan 2011, 16:37

Von NiickIF geschrieben:
sCion: du meinst also so?

Code: Select all

    <div style="max-width: 186px">
      <div style="background-color: #FFFFFF; opacity: 0.5; heigth: 40px; width: 87px;float:left;">
            <h2 style="text-align: center; font-size: 20px">test</h2>
        </div>
        <div style="background-color: #FFFFFF; opacity:0.5;heigth: 40px; width: 87px; margin-left: 89px; margin-top: 0px;float:left;">
            <h2 style="text-align: center; font-size: 20px">test2</h2>
        </div>
      </div>

dann stehen die aber auch wieder nicht nebeneeinander und die größen sind wieder falsch...

Frank: danke so funktionierts =)

Das wort steht ja durch

Code: Select all

text-align: center

in der mitte (rechts,links) gibt es auch einen befehlt für oben,unten? oder muss ich mit margin-top: 10px; arbeiten? weil ich bei jedem kästchen eine andere schriftgröße brauche und somit das bei jedem kästchen einzeln probieren muss... (brauche mehr als 2)

badanation · Post by **badanation** » Thu 6. Jan 2011, 16:53

Von Frank geschrieben:
Guck mal hier: http://www.css4you.de/Texteigenschaften ... align.html

badanation · Post by **badanation** » Thu 6. Jan 2011, 16:58

Von NiickIF geschrieben:
Wow, danke für die seite, hatte auch eine aber die war nicht so umfangreich =)

Post by **HansDampf40** » Thu 6. Jan 2011, 18:21

Nur mal als Erklärung:

Wenn du 2 Div ohne weitere Positionierung anzeigen lässt, stehen diese untereinander.

Wenn du weiterhin für das 2. Div ein Margin-Left hinzufügst, bezieht sich das auf seine "normale" Position... in dem Fall, unter dem ersten und nach Rechts versetzt.

Was ist denn dein Endzielt ? Sonst würde ich aber in jedem Fall den Weg von Frank nehmen

1. Denn CSS-Bereich auslagern, entweder komplett in eine andere Datei, aber mindestens in den Header hinein

2. Die Postion direkt bezeichnen über "position" und nicht über margin. Margin ist gut für Internetseiten, wo man ja nie genau weiß wie die Auflösung ist von dem der davor sitzt... beim Wave wissen wir die Auflösung aber und es gibt auch nur die Eine... Gut, ok, wenn du es auch für die "Kleinen" machen willst, dann Zwei... aber das war es dann schon.

Gruß

HD

badanation · Post by **badanation** » Thu 6. Jan 2011, 18:25

Von NiickIF geschrieben:
achso danke...
als position benutzt man folgende Befehle:

left: 1px;
right: 1px;
top: 1px;
bottom: 1px;

richtig?

Mobilenations - die smartphone-community

Anfängerfragen

Re: Anfängerfragen

Re: Anfängerfragen

Re: Anfängerfragen

Re: Anfängerfragen

Re: Anfängerfragen

Re: Anfängerfragen

Re: Anfängerfragen

Re: Anfängerfragen

Re: Anfängerfragen

Re: Anfängerfragen