Beiträge von Simuletsplay

Simuletsplay

Aber wie kann ich es machen, dass in diesem Bereich noch ein Text steht? Also dort soll "Neu" oder "Wichtig" drinne stehen...

Simuletsplay

Vielen Dank für eure Antworten...

Simuletsplay

Hi Leute... Wie kann man den Roten Bereich erstellen? (→ Siehe Bild!)

http://abload.de/img/men-bearbeitetk0s5b.png

Ich benutze folgende Codes:

Code

<div id="menü-div"><nav>           
 <ul>                
<li><a href="index.php">Start</a>                
<li><a href="news.php">News</a>               
<li><a href="clans.php">Clans</a>               
<li><a href="range.php">Ränge</a>                
<li><a href="games.php">Games</a>                
<li id="sonderbutton"><a href="bewerben.php">Bewerben</a></li>            
</ul>        </nav>        </div>

Und CSS:

Code

body{
	margin: 0;
	padding: 0;
	font-family: verdana;
	background-color: white;
	padding-bottom: 20px;
}
nav
{
	width: 1024px;
	border-bottom: 3px solid orange;
	background: lightblue;
	color: white;
	align-items: center;
	justify-content: center;
	float: center;
	padding-left: 20px;

}
ul
{
	width: 80%;
	margin: 0 auto;
	padding: 0;
}
ul li
{
    list-style: none;
    display: inline-block;
 }
ul li :hover
{
	background: orange;

}
ul li a
{
    color: #fff;
    text-decoration: none;
    display:block;
    padding:20px;
}
#sonderbutton
{
	background: #508cb1;
	list-style: none;
    display: inline-block;
}
{
	display: flex;
	align-items: center;
	justify-content: center;
}

Alles anzeigen

Meine Webseite: http://simuundquex.de

Ich bitte um hilfe...

Simuletsplay

Ja Genau!

Simuletsplay

https://manuplayslp.de [VORLAGE]
http://simuundquex.de [MEINE SEITE]

Simuletsplay

Moin, moin.
Ich habe einen guten Freund, der auch eine Webseite besitzt, un er hat bei sich seine Teamspeak-Icons verlinkt:
https://manuplayslp.de/ und dann runterscrollen...

Ich habe es versucht nachzumachen, es hat aber nicht funktioniert!
Woran liegt es? Oder wie kann ich es besser machen?

Code

#ranklistleft{
	display: flex;
	align-items: center;
	justify-content: center;
	float: left;
	margin-left: 20px;
}
#rankname
{
	float: left;
	margin-left: 10px;
}
#ranklistleftzwei
{
	display: flex;
	align-items: center;
	justify-content: center;
	float: left;
	margin-left: 20px;
}

Alles anzeigen

Code

<div id="ranklistleft">			<p>
			<div id="rankicon">
				<img src="/Bilder/gast.png" alt="Das Bild konnte nicht geladen werden...">
			</div>
			<div id="rankname">
				<p>Gast</p>
			</div></p>
		</div>
		<div id="ranklistleftzwei">
			<div id="rankicon">
				<img src="/Bilder/verifiziert.png" alt="Das Bild konnte nicht geladen werden...">
			</div>
			<div id="rankname">
				<p>Verifiziert</p>
			</div>
		</div>
		<div id="ranklistcenter">
			<div id="rankicon">

			</div>
			<div id="rankname">

			</div>
		</div>
		<div id="ranklistright">
			<div id="rankicon">

			</div>
			<div id="rankname">

			</div>
		</div>

Alles anzeigen

Simuletsplay

Sorry

Webseite: http://simuundquex.de

html (ohne code)
<!doctype html>
<html>
<head>
<meta charset="utf-8">
<title>SimuUndQuex</title>
<link rel="stylesheet" href="stylesheet.css">
<link rel="shortcut icon" href="server-icon.ico" type="image/x-icon">
</head>
<body>
<nav>
<ul>
<li><a href="index.html">Start</a></li>
<li><a href="news.html">News</a>
<li><a href="clans.html">Clans</a>
<li><a href="range.html">Ränge</a>
<li><a href="games.html">Games</a>
</ul>
</nav>
<div>
<h1>News</h1>
</div>
<div>
<div id="newsbuttondiv">
<a href="news/teamspeak-upgrade.html"><img src="news_tsupgrade.png" alt="Das Bild konnte nicht geladen werden..." /></a>
</div>
</div>
</body>
</html>

Simuletsplay

Moin!
Ich habe das Problem, dass nur einige meiner CSS-Style-Optionen (keine Ahnung wie ich das nennen sollte xD) funktionieren.
Um es für mich leichter zu machen, habe ich mir alles Dateien auf meinen Rechner gezogen und die an ausprobiert...
So hat mir alles gefallen und es hat auch alles funktioniert!
Jetzt habe ich meine Dateien hochgeladen und es fasst nix übernommen worden!

Probleme:
- die Seite "news" funktioniert nicht
- meine Buttons werden entweder falsch angezeigt oder die Maus verändert sich nicht (also der Mauszeiger)
- meine Navigation verrutscht immer noch, obwohl sie auf dem PC einwandfrei funktionierte!

Meine idex.html

HTML

<!DOCKTYPE html><html lang="de">	<head>		<meta charset="utf-8">		<title>SimuUndQuex</title>		<link rel="stylesheet" type="text/css" href="stylesheet.css">		<link rel="shortcut icon" href="/Bilder/server-icon.ico" type="image/x-icon">	</head>	<body>	<link rel="stylesheet" type="txt/css" href="style.css">		<nav>			<ul>				<li><a href="index.html">Start</a></li>				<li><a href="news.html">News</a>				<li><a href="clans.html">Clans</a>				<li><a href="range.html">Ränge</a>				<li><a href="games.html">Games</a>			</ul>		</nav>				<div>			<div>			<h1>Herzlich Willkommen</h1>			</div>			<div id="Banner">			<img src="/Bilder/ts3banner_märz_2018_neu.png" alt="Das Bild konnte nicht geladen werden...">			</div>		</div>		<div>			<div id="willkommenstext">			<p>Hallo,			<br>Wir sind SimuUndQuex also Simuletsplay und minimiquex.			<br>Daher auch unser Name.			<br>Aktuell besitzen wir einen Teamspeak und einen Minecraft-Server.			<br>Wir hoffen, dass du viel Spaß auf allen unseren Servern hast!			<br>			<br>Mit freundlichen Grüßen			<br>SimuUndQuex-ServerTeam</p>			</div>            <div id="button">            <button type="button" id="tsbutton" onclick="location.href='ts3server://simuundquex.de'">Verbinde dich auf unseren Teamspeak</button>            </div>        </div>    </body></html>

Meine CSS datei:

Code

body{
	margin: 0;
	padding: 0;
	font-family: verdana;
}
nav
{
	width: 100%;
	background: lightblue;
}
ul
{
	width: 80%;
	margin: 0 auto;
	padding: 0;
}
ul li
{
	list-style: none;
	display: inline-block;
}
ul li :hover
{
	background: orange;
}
ul li a
{
	color: #fff;
	text-decoration: none;
    display:block;
    padding:20px;
}
h1
{
	font-size: 50px;
	color: grey;
	text-align: center;	
}
#Banner
{
	display: flex;
	align-items: center;
	justify-content: center;
	padding-bottom: 20px;
}
#willkommenstext
{
	display: flex;
	align-items: center;
	justify-content: center;
	margin: auto;
	margin-bottom: 20px;
	border: #000000 1px solid;
	width: 1024px;
}
#ranktext
{
	display: flex;
	align-items: center;
	justify-content: center;
	margin: auto;
	border: #000000 1px solid;
	width: 1024px;
}
#lsbanner
{
	margin-top: 50px;
	display: flex;
	align-items: center;
	justify-content: center;
}
#fortnitebanner
{
	margin-top: 8px;
	display: flex;
	align-items: center;
	justify-content: center;
}
#mcbanner
{
	margin-top: 8px;
	margin-bottom: 100px;
	display: flex;
	align-items: center;
	justify-content: center;
}
#button
{
	display: flex;
	align-items: center;
	justify-content: center;
}
#createclan
{
	background-color: mediumseagreen;
	border: none;
    color: white;
    padding: 15px 32px;
    text-align: center;
    text-decoration: none;
    font-size: 16px;
    cursor: pointer;
}
#createclan:hover
{
    background-color: seagreen;
}
#tsbutton
{
    background: #009933;
    border: none;
    color: white;
    padding: 15px 32px;
    text-align: center;
    text-decoration: none;
    font-size: 16px;
    cursor: pointer;
}
#tsbutton:hover 
{
    background-color: #FF6600
}




#tsbutton:active 
{
  background-color: #FF6600;
  box-shadow: 0 5px #666;
  transform: translateY(4px);
}
#gameslist
{
    display: flex;
	align-items: center;
	justify-content: center;
}
#newsbutton
{
    height: 250px;
    width: 500px;
    background: #FFFFFF;
    border: 2px solid grey;
    color: black;
    padding: 15px 32px;
    text-align: center;
    text-decoration: none;
    font-size: 16px;
    cursor: pointer;

}
#newsbutton:hover
{
    background-color: #FFCC99;
}
#newsbutton:active
{
  background-color: #FF6600;
  box-shadow: 0 5px #666;
  transform: translateY(4px);
}
#newsbuttondiv
{
    display: flex;
	align-items: center;
	justify-content: center;
    margin-top: 50px;
}

Alles anzeigen

Meine News-Datei (dort wird nix angezeigt)

HTML

<!doctype html><html>	<head>		<meta charset="utf-8">		<title>SimuUndQuex</title>		<link rel="stylesheet" href="stylesheet.css">		<link rel="shortcut icon" href="server-icon.ico" type="image/x-icon">	</head>	<body>		<nav>			<ul>				<li><a href="index.html">Start</a></li>				<li><a href="news.html">News</a>				<li><a href="clans.html">Clans</a>				<li><a href="range.html">Ränge</a>				<li><a href="games.html">Games</a>			</ul>		</nav>        <div>			<h1>News</h1>			</div>		<div>            <div id="newsbuttondiv"> 			            <a href="news/teamspeak-upgrade.html"><img src="news_tsupgrade.png" alt="Das Bild konnte nicht geladen werden..." /></a>            </div>		</div>	</body></html>

Ich bitte um dringende Hilfe

Simuletsplay

Hallo nochmal... Ich habe erstmal alles so angewendet, wie du es sagtest, aber auf meinem PC! Nun habe ich alle meine Dateien hochgeladen und es funktionier NIX könntest du eventuell noch einmal schauen?
Ich habe es so in der css datei:

Code

nav{
	width: 100%;
	background: lightblue;
}
ul
{
	width: 80%;
	margin: 0 auto;
	padding: 0;
}
ul li
{
	list-style: none;
	display: inline-block;
}
ul li :hover
{
	background: orange;
}
ul li a
{
	color: #fff;
	text-decoration: none;
    display:block;
    padding:20px;
}

Alles anzeigen

Simuletsplay

Ja... Vielen dank!

Simuletsplay

Sry... Geht nur bei TS also einfach simuundquex.de

Simuletsplay

Ich habe mir das Video als Tutorial genommen!

Wer mir helfen kann: ts3server://simuundquex.de

einfach auf den Link klicken

- - - Aktualisiert - - -

Wenn du bei dem Menü über die Wörter rüberfährst, erscheint ein oranger rahmen... dieser Rahmen sollte breiter sein, sonst sieht das #?!;/('! aus (will nicht sch... schreiben)

Bitte schaut euch das Video nochmal an und vergleicht es mit meiner Webseite.... Ich weiß nicht, warum er das nicht macht

Entschuldige Gastl es liegt daran, dass ich es erstmal rausgenommen habe und nur

padding-top: 20px;
padding-bottom: 20px;

drin...

Simuletsplay

Hallo ich habe leichte schwierigkeiten mit meiner Navigation!

Problem:
Ich habe bei CSS den tag :hover benutzt. soweit funktionier es auch, aber wenn ich mit der Maus rübergehe, verschiebt sich alle nach rechts, also was im Menü daneben steht (rechts).
Wenn ich padding nur oben und unten mache, verutscht das nicht, aber es endet direkt vor/hinter dem Wort!

Ich habe alles so wie im Video gemacht:
https://www.youtube.com/watch?v=XZsuI5wyRzs

meine Webseite:
http://simuundquex.de

Ich hoffe auf eine Schnelle antwort

Beiträge von Simuletsplay

HTML und CSS - Navigation → Sonderbereich

HTML und CSS - Navigation → Sonderbereich

HTML und CSS - Navigation → Sonderbereich

Texte Untereinander

Texte Untereinander

Texte Untereinander

CSS wird nicht richtig erkannt

CSS wird nicht richtig erkannt

HTML und CSS - Navigation

HTML und CSS - Navigation

HTML und CSS - Navigation

HTML und CSS - Navigation

HTML und CSS - Navigation