2 Blockelemente mittig nebeneinander

html.de-Forum HTML, XHTML & CSS
1

Ich schon wieder. :mrgreen:

Ich möchte zwei Blockelemente (notwendig für Bild-Hovereffekt) nebeneinander (hab ich schon geschafft mit float:left) MITTIG darstellen. Mit text-align:center geht es schon mal nicht, weil dies nur bei inline-Elementen funktioniert, also hab ich probiert, und es hat auch funktioniert. :slight_smile: Allerdings nur mit EINEM Blockelement (also ohne floaten). Wenn ich das gleiche mit zwei mache, werden sie aber linksbündig dargestellt…

Hoffe mir kann jemand helfen. :?

HTML:

[CODE] 

    <center>
      <a class="psp" href="#">PSP</a>
      <a class="pc" href="#">PC</a>
    </center>

  </div>[/CODE]

CSS:

[CODE].psp {
text-decoration:none;
border:0;
padding:0;
display:block;
text-indent:-10px;
letter-spacing:-10px;
font-size:0;
width:87px;
height:88px;
float:left;
background:url(„psp.png“) 0 0 no-repeat;
}

.psp:hover {
background-position:-87px 0;
}

.pc {
text-decoration:none;
border:0;
padding:0;
display:block;
text-indent:-10px;
letter-spacing:-10px;
font-size:0;
width:87px;
height:88px;
float:left;
background:url(„pc.png“) 0 0 no-repeat;
}

.pc:hover {
background-position:-87px 0;
}[/CODE]

2

Vergiss , das is’ „schmutzig“ :stuck_out_tongue:

Nach diesem Prinzip wird es gehen (weiß nicht genau, was du vorhast, daher hier nur der Grundaufbau, zum drauf aufbauen):

#wrap { width:174px; margin:0 auto; } #left { float:left; width:87px; } #right { margin-left:87px; width:87px; } .clear { clear:both; }[code]

links
rechts

[/code]Nicht getestet, mit den Größenangeben wirst du wohl etwas spielen müssen, damit es deinen Anforderungen entspricht (wenn es untereinander steht, beachte, dass margin, padding und border zur Breite hinzuaddiert werden und pass die Breite des umgebenden Containers an).
3

#Björn, prinzipiell richtig, aber zeig den Leuten doch nicht wieder so eine div-Suppe, das kannst du doch wirklich besser…

machs lieber so

[code]

[/code]da steckt schon mal Html Sinn hinter

gruß
csstester

4

sinn? mit der ausnahme das du deine LI tags noch mit DIV tags abschließt sollte sonst alles richtig sein ^^

5

ups, wohl zu schnell gewesen…lol, danke für den hinweis:mrgreen:

6

Wie gesagt, ich wollte nur das Prinzip darstellen, da ich den Zweck nicht genau kannte/kenne. Der Code sollte lediglich das CSS und die Anordnung der Elemente zeigen (man muss ja auch nicht alles fertig servieren :wink: ).

Außerdem ist
in einer Liste völliger Unsinn und alles andere als Standardkonform :stuck_out_tongue:

Aber danke, dass du der Meinung bist, ich könne das besser :mrgreen:

7

Nicht wirklich. Anstatt eine div-„Suppe“, gibt es jetzt eben eine li-Suppe. Und Sinn steckt da auch nicht dahinter. Denn die HTML-Tags für Listen sind für Listen gedacht und nicht für die Positionierung von Elementen.

@BcF:
DANKE, funktioniert perfekt! :smiley:

8

ähh hallo, das was du uns serviert hast war ne navi mit 2 Links und da macht ne Liste großen Sinn.

Ja das
macht nicht wirklich sinn in der Liste, ist aber nur ein leeres Tag zu clearen wie man sieht.

9

Ist doch irgendwie egal, obs jetzt n div oder ne Liste ist…

10

mal benenbei… ein
macht nirgendwo sinn ^^ wenn überhaupt würde ein
irgendwo sinn machen denn in xHTML zeiten sollte das so langsam aber sicher aussterben ^^

11

Wo bin ich denn nu gelandet?

Selbstverständlich macht ein
sinn, nämmlich da wo explizit ein Umbruch erwünscht ist, z.B in einem element.

Und wenn du schon XHtml ansprichst solltest du wissen das
ja nun veraltet ist und nur nicht mehr XHtml Standart entspricht

12

genau darum sage ich ja das ein
eigentlich keinen sinn mehr macht… sondern nur
(WENN man den doctype entsprechend gestaltet…)

das kleine spielchen sollte doch jeder verstehen ^^ naja an gelegenheiten wo ein umbruch wirklich notwendig ist habe ich nun eben nicht gedacht aber zum glück sind diese ja auch nur eine ausnahme ^^

und der grund warum ich das gesagt habe ist, jeder der html lernt und weiß was ein br ist der verwendet es falsch, unteranderem PHP anfänger mit nl2br -.-’

13

Nun, tatsächlich kann man sich hier streiten.
Es gibt die einen, die sagen,
ist ein Tag, das dem Layout dient und damit nichts mehr im HTML-Code zu suchen hat (Trennung von Inhalt und Layout).
Und es gibt die anderen.

Ich sehe das auch so, dass
eigentlich eher ein „Layout-Tag“ ist. Aber tatsächlich verwende ich das auch genau da, wo Du es jetzt auch platziert hast. Bei einer Adresse.

Gruß,
-Efchen