Ergebnis 1 bis 5 von 5

Thema: CSS Verschiebt sich

  1. #1
    Youngster
    Registriert seit
    26.05.2009
    Beiträge
    10
    Danke
    0
    Bekam 0 mal "Danke" in 0 Postings

    Frage CSS Verschiebt sich

    Moin zusammen, hoffe ihr könnt mir da helfen

    Ich bin gerade dabei, eine fertige CSS Webseite zu ändern. Nun hab ich aber ein kleines Problem Hoffe die Bilder sind nich allzugroß



    Beim verkleinern den Browsers verschiebt sich der erste Container nach unten(Spiele, Ergebnisse und Tabelle) siehe Bild:


    Wie kann ich das ändern, das beide Container eine feste Position haben und sich nicht mehr verschieben? Der erste Container ist "Sidebar" und der zweite "ads"
    Code:
    body {
        margin: 0;
        padding: 0;
        background: #eafded url(images/bg.jpg) repeat-x left top;
        text-align: justify;
        font: 13px "Trebuchet MS", Arial, Helvetica, sans-serif;
        color: #000000;
    }
    
    form {
        margin: 0;
        padding: 0;
    }
    
    fieldset {
        margin: 0;
        padding: 0;
        border: none;
    }
    
    input, textarea {
        padding: 5px;
        border: 1px solid #626262;
        font: normal 1em "Trebuchet MS", Arial, Helvetica, sans-serif;
    }
    
    h1, h1 a, h2, h2 a, h3, h3 a {
        margin: 0;
        text-decoration: none;
        font-weight: normal;
        color: #027415;
    }
    
    h1 {
        letter-spacing: -3px;
        font-size: 2.6em;
    }
    
    h2 {
        letter-spacing: -2px;
        font-size: 2em;
    }
    
    h3 {
        margin-bottom: 2em;
        font-size: 1em;
        font-weight: bold;
    }
    
    p, ol, ul {
        margin: 0 0 2em 0;
        line-height: 200%;
    }
    
    blockquote {
        margin: 0 0 0 1.5em;
        padding-left: 1em;
        border-left: 5px solid #DDDDDD;
    }
    
    a {
        color: #000000;
        text-decoration: none;}
    
    a:hover {
        text-decoration: none;
        color: #FF5134;
    }
    
    img {
        border: none;
    }
    
    img.left {
        float: left;
        margin: 8px 20px 0px 0px;
        border: 2px solid #434343; 
    }
    
    
    /* Header */
    
    #wrapper {
    }
    
    #header {
        width: 990px;
        height: 110px;
        margin: 0 0;
    }
    
    #logo h1, #logo p {
        float: left;
    }
    
    #logo h1 {
        height: 88px;
        padding: 0 90px 0 0;
        font-size: 4em;
    }
    
    #logo p {
        margin: 0 0 0 -80px;
        padding: 55px 0 0 0;
        line-height: normal;
        letter-spacing: -1px;
        font-size: 1.2em;
        font-weight: bold;
    }
    
    #logo a {
        text-decoration: none;
        font-weight: bold;
    }
    
    #logo p a {
        color: #CF3822;
    }
    
    /* RSS */
    
    #rss {
        padding: 30px 39px 20px 0;
        text-align: right;
    }
    
    #rss a {
        padding: 0 0 3px 24px;
        text-decoration: none;
        font-weight: bold;
        color: #FF5134;
    }
    
    #rss a:hover {
    }
    
    /* Menu */
    
    #menu {
        width: 895px;
        height: 60px;
        margin: 0 auto;
    }
    
    #menu ul {
        margin: 0;
        padding: 0;
        list-style: none;
    }
    
    #menu li {
        display: inline;
        font-family: Tahoma, Arial, sans-serif;
    }
    
    #menu a {
        display: block;
        float: left;
        margin: 6px 4px 6px 2px;
        padding: 1px 10px;
        text-decoration: none;
        font-size: 1em;
        font-weight: normal;
        color: #FFFFFF;
    }
    
    #menu a:hover {
        background: #E8922B;
    }
    
    #menu .current_page_item {
    }
    
    #menu .current_page_item a {
        background: #E8922B;
        border-right: 2px solid #B24100;
        border-bottom: 1px solid #B24100;
    }
    
    /* Page */
    
    #page {
        width: 80%;
        margin: 0 50px;
        padding: 30px 0;
    }
    
    /* Ads */
    
    #ads {
        float: right;
        width: 160px;
        padding: 0 0 0 20px;
    }
    
    #ads img {
        border: 1px dashed #F5E0B7;
    }
    /* Content */
    
    #content {
        float: left;
        width: 550px;
        
    }
    
    .post {
        margin-bottom: 50px;
        border-bottom: 1px #A90000 dashed;
    }
    
    .post .title {
        font-family: Georgia, "Times New Roman", Times, serif;
    }
    
    .post .title h2 {
        font-size: 2.2em;
        color: #027415;
    }
    
    .post .title p {
        margin: 0;
        line-height: normal;
        color: #BABABA;
    }
    
    .post .title p a {
        color: #880A0B;
    }
    
    .post .entry {
        padding-top: 30px;
    }
    
    .post .links {
        float: left;
        width: 510px;
        margin: 0;
        padding: 6px 0 0 0px;
    }
    
    .post .links a {
        padding: 5px 7px;
        text-decoration: none;
        text-transform: uppercase;
        font-family: Arial, Helvetica, sans-serif;
        font-weight: bold;
        font-size: 10px;
        color: #027415;
        background: #C65C18;
        border-top: 1px solid #D7D3CD;
        border-left: 1px solid #D7D3CD;
        border-right: 2px solid #362F23;    
        border-bottom: 1px solid #362F23;
    
    }
    
    .post .links a:hover {
        text-decoration: none;
    }
    
    .post .links .more {
        color: #FFFFFF;
    }
    
    .post .links .comments {
        color: #FFFFFF;
    }
    
    /* Sidebar */
    
    #sidebar {
        float: right;
        width: 240px;
        background: #F8F4DC;
        border: 1px dashed #F5E0B7;
        margin-bottom: 25px;
    }
    
    #sidebar ul {
        margin: 20px 0 0 0;
        padding: 0;
        list-style: none;
    }
    
    #sidebar li {
        margin-bottom: 20px;
    }
    
    #sidebar li ul {
        padding: 0px 20px 0px 20px;
        line-height: 200%;
    }
    
    #sidebar li li {
        margin: 0;
        padding-left: 15px;
        padding-bottom: 5px;
    }
    
    #sidebar h2 {
        width: 210px;
        height: 30px;
        padding: 5px 0 0 20px;
        letter-spacing: -1px;
        font-size: 1.6em;
        font-family: Georgia, "Times New Roman", Times, serif;
    }
    
    #sidebar a:hover {
    
    }
    
    /* Footer */
    
    #footer {
        clear: both;
        width: 80%;
        margin: 0 10px;
        padding: 30px 0;
        background: url(images/img02.jpg) repeat-x left top;
        color: #B85212;
    }
    
    #footer p {
        margin: 0 0 5px 0;
        text-align: center;
        line-height: normal;
        font-size: .9em;
    }
    
    #footer a {
        background: #E8922B;
        padding: 1px 6px;
        border-right: 2px solid #B24100;
        border-bottom: 1px solid #B24100;
        text-decoration: none;
        color: #FFFFFF;
    }
    Das ja wirklich groß geworden :/ ..

    Hoffe ihr könnt mir da helfen..

    Mfg xisax
    Achtung: Dies ist ein alter Thread im HTML und Webmaster Forum
    Diese Diskussion ist älter als 90 Tage. Die darin enthaltenen Informationen sind möglicherweise nicht mehr aktuell. Erstelle bitte zu deiner Frage ein neues Thema im Forum !!!!!

  2. #2
    Bandit
    Gast

    Standard AW: CSS Verschiebt sich

    Ein Link zu der Seite wäre nicht schlecht...

  3. #3
    Youngster
    Themenstarter

    Registriert seit
    26.05.2009
    Beiträge
    10
    Danke
    0
    Bekam 0 mal "Danke" in 0 Postings

    Standard AW: CSS Verschiebt sich

    Hi..Sry Link hatte ich vergessen zu posten

    http://sv.xisax.de

    Ich möcht das der untere Bereich einfach fixiert ist und sich nix verschiebt, wenn man das Browserfenster minimiert.

  4. #4
    Kaiser(in)
    Registriert seit
    24.04.2006
    Ort
    Ludwigshafen
    Beiträge
    2.720
    Danke
    0
    Bekam 0 mal "Danke" in 0 Postings

    Standard AW: CSS Verschiebt sich

    Das ist vom Prinzip her eine ganz normale Erscheinung, weil je nach Fenstergröße einfach der Platz nicht ausreicht, um alles unterzubringen.

    Mit folgenden Änderungen sollte es klappen, wobei bei zu kleinem Fenster dann horizontal gescrollt werden muss:


    Code:
    #wrapper {
    width: 990px;
    margin: 0 auto;
    }
    
    #page {
    padding: 30px 0;
    }

  5. #5
    Youngster
    Themenstarter

    Registriert seit
    26.05.2009
    Beiträge
    10
    Danke
    0
    Bekam 0 mal "Danke" in 0 Postings

    Standard AW: CSS Verschiebt sich

    Moin,

    Danke danke danke ...genau das hab ich gesucht, jetzt weiss ich wie ich es sogar mittig bekomme

Ähnliche Themen

  1. Navigation verschiebt sich
    Von Billbos im Forum HTML & CSS Forum
    Antworten: 6
    Letzter Beitrag: 22.01.2009, 11:02
  2. Tabelle verschiebt sich!
    Von eatofid im Forum HTML & CSS Forum
    Antworten: 6
    Letzter Beitrag: 14.03.2008, 14:33
  3. Design verschiebt sich
    Von massaw13 im Forum PHP Forum - Apache - CGI - Perl - JavaScript und Co.
    Antworten: 7
    Letzter Beitrag: 14.02.2007, 00:26
  4. text verschiebt sich
    Von im Forum HTML & CSS Forum
    Antworten: 4
    Letzter Beitrag: 14.10.2006, 15:11
  5. iframe verschiebt sich
    Von Max im Forum HTML & CSS Forum
    Antworten: 7
    Letzter Beitrag: 09.12.2005, 23:39

Stichworte

Berechtigungen

  • Neue Themen erstellen: Nein
  • Themen beantworten: Nein
  • Anhänge hochladen: Nein
  • Beiträge bearbeiten: Nein
  •