kostenloser Webspace werbefrei: lima-city


Layout position

lima-cityForumDie eigene HomepageHTML, CSS & Javascript

  1. Autor dieses Themas

    programtools

    programtools hat kostenlosen Webspace.

    Hi erstmal,
    meine Überschrift ist ein bisschen doof aber ich wusste nicht wie ich mein Problem in wenige Worte fassen sollte.
    Ich möchte meine Homepage zentriert haben.
    <center>
    ...
    </center>

    damit klappts perfekt - allerdings möchte ich nicht mit htmlbefehlen sondern css arbeiten.

    Doch überall wo ich schaue, wird nur die Möglichkeit mit position:absolute; und negativem margin vorgestellt:

    position:absolute;
    left: 50%;
    width: 750px;
    margin-left: -388px; /* negative Hälfte von width:700px */
    top:165px;


    Ich möchte meine Elemente aber auf keinen Fall mit absolute positionieren, weil meine ganzen divs dan überhaupt keine Wirkung haben. Gibts da noch weitere möglichkeiten???

    Außerdem möchte ich meine Divs (egal ob mit hintergrundbild oder anderst) mit einem dünnen Rahmen ausstatten. Dieser Rahmen soll allerdings abgerundete Ecken haben UND in jedem Browser (ja auch im IE weils im FF ja glaub son Befehl gibt) angezeigt werden. Auch hier möchte ich nicht mit Bildern, die mit z-index:-1; und position:absolute; ausgestattet sind arbeiten. Gegen z-index spricht an sich nix nur kann er eben nur bei absolut positionierten Elementen verwendet werden.

    Ich hoffe da könnt ihr mir helfen - da ich trotz tagelangem Googeln nichts gefunden hab :(

    schonmal jetzt vielen Dank!!
    MVG







  2. Diskutiere mit und stelle Fragen: Jetzt kostenlos anmelden!

    lima-city: Gratis werbefreier Webspace für deine eigene Homepage

  3. "margin: 0 auto;" hilft dir weiter.

    FF
  4. Autor dieses Themas

    programtools

    programtools hat kostenlosen Webspace.

    sry aber das hab ich schon versucht. Es klappt nur im FF im IE passiert garnix. trotzdem Danke aber ich brauche eine Lösung die in jedem Browser klappt (hatt ich auch glaub oben so hingeschrieben).
  5. programtools schrieb:
    sry aber das hab ich schon versucht. Es klappt nur im FF im IE passiert garnix. trotzdem Danke aber ich brauche eine Lösung die in jedem Browser klappt (hatt ich auch glaub oben so hingeschrieben).


    Das von fatfreddy angegebene CSS funktionier in "jedem" Browser (sofern er nicht "uralt" ist), jedenfalls bei mir. Du musst etwas falsch gemacht haben. Auf welchen Selektor hast du das CSS angewendet?

    Gruß Tom

    Beitrag zuletzt geändert: 5.2.2010 16:07:04 von tom-moeller
  6. Autor dieses Themas

    programtools

    programtools hat kostenlosen Webspace.

    ich habs erst im body versucht und dann in dem Div das ich positionieren wollte (main-div in das dann der gesammte seiteninhalt kommt)
  7. programtools schrieb:
    .... (main-div in das dann der gesammte seiteninhalt kommt)


    Genau auf den musst Du es anwenden. Auf body gehts nicht. Du wirst im ganen Netz keine andere Möglichkeit genannt bekommen, browserübergreifend ein DIV zu zentrieren.

    Gruß

    Edit// Der IE6 zeigt es natürlich nur an, wenn die Dokumenttyp-Deklarationen für den standardkonformen Modus eingerichtet sind. Link:

    Beitrag zuletzt geändert: 5.2.2010 16:43:26 von tom-moeller
  8. Autor dieses Themas

    programtools

    programtools hat kostenlosen Webspace.

    vielen Dank schonmel...
    ich hab mich jetzt damit abgefunden es so machen zu müssen aber position:absolute; wird dafür doch nicht benötigt oder??

    Aber was mach ich mit den Divs-grafiken... ??? Das ist nähmlich etwas wörüber ich mir schon lange Gedanken mache und was ich einfach nicht rauskrig!!
  9. Schon mal mit position: relative; versucht?

    Um runde Ecken um deine Div-Container zu bekommen, die auch auf allen Browsern so angezeigt werden, würde ich dir empfehlen, dass mit Grafiken zu lösen, da die CSS-Lösung noch nicht von allen aktuellen Browsern korrekt wiedergegeben wird.
  10. Autor dieses Themas

    programtools

    programtools hat kostenlosen Webspace.

    sry aber hab ich noch nie gehört. Kannst du mir da erklären was das ist?? (am besten mit Beispiel oder so damit ichs versteh!!) und wegen den Grafiken - wie soll ich das machen?

    vielen dank - hoffe dass du mir dass noch ein bisschen näher erklären kannst

    MVG
  11. lokishomepage

    Kostenloser Webspace von lokishomepage

    lokishomepage hat kostenlosen Webspace.

    Du must mit einen Grafik Programm die gewünschte Form etc. erstellen. Z.B. Gimp ist kostenlos.

    Damit du weiter mit der DIV box arbeiten kannst, bindest du die Grafik am besten als background-image:url(); ein. Vergesse aber nicht, die Größe der DIV Box, an die der Grafik an zu passen.
  12. programtools schrieb:
    sry aber hab ich noch nie gehört. Kannst du mir da erklären was das ist?? (am besten mit Beispiel oder so damit ichs versteh!!) und wegen den Grafiken - wie soll ich das machen?

    vielen dank - hoffe dass du mir dass noch ein bisschen näher erklären kannst

    MVG


    Kein Problem. Bei SELFHTML findest Du zu position:

    Mit position: können Sie die Positionsart bestimmen. Folgende Angaben sind erlaubt:

    static = keine spezielle Positionierung, normaler Elementfluss (Normaleinstellung).
    relative = relative Positionierung (Verschiebung), gemessen an der Normalposition oder Anfangsposition des Elements selbst.
    absolute = absolute Positionierung, gemessen am Rand des nächsthöheren Vorfahrenelements, das nicht die Normaleinstellung position:static aufweist. Scrollt mit.
    fixed = absolute Positionierung, gemessen am "Viewport", d.h. am Browserfenster. Bleibt beim Scrollen stehen.


    Wenn Du mehr Hilfe brauchst, musst Du aber schon konkreter deine Vorstellungen bzw. dein Ziel schildern, damit ich dir besser helfen kann.
  13. Autor dieses Themas

    programtools

    programtools hat kostenlosen Webspace.

    @lokishhomepage
    danke für die Hilefe (ich nutze inkskape - kann man meiner Meinung nach viel bessere grafiken als mit gimp machen abba egal...)
    doch mit dem background bin ich garnicht einverstanden! Das ist ja genau das was ich nicht will!!!

    @das-atrium
    auch vielen Dank an dich für deine Bemühungen mir zu helfen! Ich habe mir das bei selfhtml mal angeachaut und auch verstanden DD

    Wegen den Grafiken ist das so ein Problem! Weil dass div 1. Nach unten hin variable sein soll (breite ist fest nur die höhe ist in %)
    fällt ein Hintergrundbild aus! Ich möchte ja ALLE Ecken rund haben. Ist das überhaupt möglich ohne zig absolut positionierte (was ich ja garnicht mag) divs/ imgs??
    Hoffe ich hab mein Anligen verständlich rübergebracht
    MVG
  14. programtools schrieb:
    Wegen den Grafiken ist das so ein Problem! Weil dass div 1. Nach unten hin variable sein soll (breite ist fest nur die höhe ist in %)
    fällt ein Hintergrundbild aus! Ich möchte ja ALLE Ecken rund haben. Ist das überhaupt möglich ohne zig absolut positionierte (was ich ja garnicht mag) divs/ imgs??
    Hoffe ich hab mein Anligen verständlich rübergebracht
    MVG


    Wenn Du den IE benutzt: Leider ja. Mir ist jedenfalls noch keine andere Lösung dafür untergekommen.
    Der FF hingegen tuts schon mit dem CSS:
    border-radius: 10px;
    -moz-border-radius: 10px;
    -webkit-border-radius: 10px;

    Wird im IE halt nur eckig angezeigt.
  15. Autor dieses Themas

    programtools

    programtools hat kostenlosen Webspace.

    Ja nur leider nutzen über 65% der Leute IE (da dieser standartmäßig installiert ist und so). Deshalb muss ich es irgendwie mit Grafiken lösen. Naja vielleicht ist das auch etwas, was einfach nicht geht. MVG
  16. coding4everyone

    coding4everyone hat kostenlosen Webspace.

    also wenn ich rundherum runde ecken haben will, dann hab ich grob gesagt drei divs:
    1.div = bild oben runde ecken
    2.div= content (zu inhalten zähle ich jetzt mal alles was zwischen dem ersten und zweiten div steht)
    3.div= bild unten runde ecken

    ich fange dann von oben an erst einmal das bild mit den runden ecken einzufügen (background-image: url(); und breite und höhe des bildes, meist auch noch margin: 0px auto; für die zentrale positionierung)
    dann kommt darunter der zweite DIV in dem dann alles andere drin ist (header, menü, diverse spalten usw.)
    und zum schluss kommt der 3. div mit dem 2. bild (wieder wie beim ersten alles festlegen)

    wenn ich die grundstruktur habe wird der content-bereich erstellt.


    Beitrag zuletzt geändert: 6.2.2010 10:40:46 von coding4everyone
  17. Autor dieses Themas

    programtools

    programtools hat kostenlosen Webspace.

    thx aber ich verstehe da was nicht:

    |----------------------------------------| ** oben (1.div)
    ? ? **mitte (mit inhalt also 2.div)
    ? ? **mitte (mit inhalt also 2.div)
    ? ? **mitte (mit inhalt also 2.div)
    ? ? **mitte (mit inhalt also 2.div)
    ? ? **mitte (mit inhalt also 2.div)
    |----------------------------------------| ** unten (3.div>


    wie mache ich jetzt den rand in der Mitte? ich will ja nicht nur runde echen sondern einen gesamten Rahmen mit runden echen.
  18. coding4everyone

    coding4everyone hat kostenlosen Webspace.

    du kannst doch z.b. einen border-left und einen border-right festlegen
  19. Also was die Runden Ecken angeht habe ich mal vor Jahren (2007) eine Lösung mit Tabellen, Bildern und Css gebastelt.
    Müsste auf jedem Browser laufen.
    Guckst Du hier oder hier
  20. Diskutiere mit und stelle Fragen: Jetzt kostenlos anmelden!

    lima-city: Gratis werbefreier Webspace für deine eigene Homepage

Dir gefällt dieses Thema?

Über lima-city

Login zum Webhosting ohne Werbung!