zurück zur Startseite
  


Zurück XHTMLforum > (X)HTML und CSS > CSS
Seite neu laden Problem mit CSS

Antwort
 
LinkBack Themen-Optionen Ansicht
  #1 (permalink)  
Alt 22.04.2015, 19:51
Neuer Benutzer
neuer user
Thread-Ersteller
 
Registriert seit: 22.04.2015
Beiträge: 2
MrBlack befindet sich auf einem aufstrebenden Ast
Standard Problem mit CSS

Hallo,
ich möchte das die Navigationszeile auf dieser Seite www.leagueofballs.de/ neben dem Kasten mit dem Inhalt setzen.
Hier der Link zu der eingebundenen CSS Datei www.privatepaste.com :: Paste Not Found

LG MrBlack

P.S. Ich hoffe auf schnelle Hilfe
Mit Zitat antworten
Sponsored Links
  #2 (permalink)  
Alt 22.04.2015, 19:52
Neuer Benutzer
neuer user
Thread-Ersteller
 
Registriert seit: 22.04.2015
Beiträge: 2
MrBlack befindet sich auf einem aufstrebenden Ast
Standard

privatepaste.com :: Paste ID e2b439cbc3 Der Link müsste jetzt funktioneieren
Mit Zitat antworten
Sponsored Links
  #3 (permalink)  
Alt 22.04.2015, 20:27
Erfahrener Benutzer
XHTMLforum-Kenner
 
Registriert seit: 10.01.2010
Beiträge: 1.123
MrMurphy ist ein sehr geschätzer MenschMrMurphy ist ein sehr geschätzer MenschMrMurphy ist ein sehr geschätzer Mensch
Standard

Hallo,

1. Verzichte auf Frames

2. Tip: Benutze HMTL5 und CSS3, XHMTL ist bereits 2006 offiziell begraben worden

3. Kuriere deine divitis aus

4. Deine Verwendung des b-Elements ist veraltet. Es dient nicht mehr dazu Text fett darzustellen. Um etwas hervorzuheben sollte das strong-Element verwendet werden.

5. Benutze UTF-8 und lass die Maskierung von Umlauten u.s.w. weg

6. Du hast ein div main mit einer Breite von 630px. Darin befinden sich ein div inhalt mit einer Breite von 630px und ein div navi mit einer Breite von 220px. Wie sollen div inhalt und div navi da nebeneinander passen?

Ich habe deine Startseite mal mit aktuellem HMTL/CSS semantisch korrekt erstellt und mit etwas Responsive Design gewürzt. Die Abstände, Schriftgrößen u.s.w. haben mich dabei nicht so sehr interessiert, die können ja noch einfach angepasst werden:

Code:
<!DOCTYPE html>
<html lang="de">
<head>
   <meta charset="utf-8"><!-- Schließende Slashes sind unter HTML5 nicht erforderlich, aber erlaubt -->
   <title>2 Boxen nebeneinander</title>
   <meta name="description" content="HTML5, CSS3">
   <meta name="viewport" content="width=device-width, initial-scale=1.0">
   <!-- Um alte IE HTML5-tauglich zu machen -->
   <!--[if lt IE 9]>
      <script src="http://html5shiv.googlecode.com/svn/trunk/html5.js" language="javascript" type="text/javascript"></script>
   <![endif]-->
   <!-- Internes CSS ("type="text/css" ist unter HTML5 nicht erforderlich) -->
   <style>
   @media all {
      /* Neue HTML5-Elemente für ältere Browser als Block-Elemente übergeben */
      header, nav, main, aside, footer, section, article, figure, figcaption, audio, video {
         display: block;
      }
      * {
         -moz-box-sizing: border-box;
         box-sizing: border-box;
      }
      html {
         font-size: 100%;
      }
      body {
         padding: 0;
         color: white;
         background-color: black;
         font-family: Verdana,Geneva,Arial,sans-serif;
         letter-spacing: 0.1rem;
         line-height: 1.6;
         width: 98%;
         padding: 0;
         margin: 1rem auto;
      }
      main {
         width: 80%;
         margin-left: 20%;
         display: flex;
      }
      article {
         background-color: #222;
         width: 70%;
         padding: 1rem;
         border: 1px solid #666;
      }
      article h1 {
         font-family: Times, "Times New Roman", serif;
         font-variant: small-caps;
         color: #0FA;
         margin-bottom: 2rem;
      }
      article strong {
         letter-spacing: 0.3rem;
      }
      nav {
         width: 30%;
         padding: 1rem;
      }
      ul {
         padding: 0;
         margin: 0;
      }
      li {
         list-style-type: none;
      }
      a {
         text-decoration: none;
         display: block;
         color: white;
         background-color: #222;
         padding: 0.1rem 0.5rem;
         border: 1px solid #666;
         margin-bottom: 0.2rem;
      }
      a:hover {
         background-color: black;
      }
      footer {
         text-align: center;
      }
   }
   @media only screen and (max-width: 1050px) {
      main {
         width: 100%;
         padding: 0;
         margin: 0;
         /*display: block;*/
         flex-direction: column;
      }
      article {
         width: 100%;
         padding: 0 1rem;
         margin: 0;
         order: 2;
      }
      nav  {
         width: 100%;
         padding: 0;
         margin: 0;
         order: 1;
      }
      nav h2 {
         display: none;
      }
      nav ul {
         display: flex;
      }
      li {
         text-align: center;
         flex: auto;
      }
      a {
         padding: 1rem 0.5rem;
      }
   }
   @media only screen and (max-width: 750px) {
      nav ul {
         flex-wrap: wrap;
      }
      li {
         width: 50%;
      }
   }
   @media only screen and (max-width: 500px) {
      li {
         width: 100%;
      }
   }
   </style>
</head>
<body>
   <main>
      <article>
         <h1>Die Senfies</h1>
         <p>Wir sind ein kleiner Clan, der Counter-Strike:Global Offensive spielt. Für CS:GO suchen wir noch aktive Mitglieder, die mit uns trainieren und Wettkampf spielen wollen. Es kommt uns nicht darauf an welcher Rang ihr seid, hauptsache ihr seid gute <strong>Teamplayer</strong>.</p>         
      </article>
      <nav>
         <h2>Navigation</h2>
         <ul>
            <li><a href="#">Startseite</a></li>
            <li><a href="#">CS:GO</a> </li>
            <li><a href="#">CS:GO Ränge</a> </li>
            <li><a href="#">Kontakt</a> </li>
         </ul>
      </nav>
   </main>
   <footer>
      <p>Diese Website wurde erstellt von Nico (Ingamename: MrBlack) </p>
   </footer>
</body>
</html>
Gruss

MrMurphy

Geändert von MrMurphy (22.04.2015 um 23:22 Uhr)
Mit Zitat antworten
Antwort

Stichwörter
css, navigation

Themen-Optionen
Ansicht

Forumregeln
Es ist Ihnen nicht erlaubt, neue Themen zu verfassen.
Es ist Ihnen nicht erlaubt, auf Beiträge zu antworten.
Es ist Ihnen nicht erlaubt, Anhänge hochzuladen.
Es ist Ihnen nicht erlaubt, Ihre Beiträge zu bearbeiten.

BB-Code ist an.
Smileys sind an.
[IMG] Code ist an.
HTML-Code ist aus.
Trackbacks are an
Pingbacks are an
Refbacks are aus


Ähnliche Themen
Thema Autor Forum Antworten Letzter Beitrag
Problem beim ein/ausblenden von Spalten in Tabellen via CSS und JavaScript chrisol_76 CSS 2 21.07.2008 18:37
Css und Steam Problem justinlenz Offtopic 3 27.03.2008 22:58
CSS Problem Adriana CSS 0 09.09.2006 17:51
CSS Tips & Tricks Webnauts Ressourcen 0 26.08.2006 00:04
Dringend: CSS Problem! zero CSS 19 31.12.2005 19:34


Alle Zeitangaben in WEZ +2. Es ist jetzt 01:50 Uhr.