• Jetzt anmelden. Es dauert nur 2 Minuten und ist kostenlos!

Frage Nav in Ecken schreiben

So, noch paar Fragen...

1. Wie bekomm ich das Logo kleiner?
2. wie kann ich die Schrift der nav weiß und größer machen?
3. Wenn ich nach oben/unten scroll kommt oben immer ein kleiner weißer Balken, aber eigentlich sollte die Homeseite 100% ausfüllen, scrollensollte unmöglich sein. Geht das?

So jetzt geh ich auch erst mal schlafen.

Gute Nacht und ein riesen Dank an alle beteiligten :)))
 
Werbung:
also 1 und 2 haben reibungslos funktioniert :)
Aber bei drei war ich mir nicht sicher ob ich überhaupt ein padding/margin drin hab, weil ich keins gefunden hab.
ich habs jetzt mal reingeschrieben. wäre das richtig?
Code:
nav ul {
  padding: 0;
  margin: 0
}
 
nein funktioniert leider immer noch nicht :/
Code:
html,
body {
    margin: 0;
    padding: 0;
    height: 100%;
    text-align: center;
}


section {
    min-height: 100%;
}

a {
    text-decoration: none;
}

li {
    list-style-type: none;
}

h1,
h2,
h3,
a {
    font-family: 'Covered By Your Grace', sans-serif;
    font-weight: 500;
    color: #000000;
    text-transform: uppercase;
}
h1:hover {
  color: #FFFFFF;
  transition: all 300ms;
  -webkit-transition: all 300ms;
  -moz-transition: all 300ms;
  -o-transition: all 300ms;
}
h2 {
    color: #000000;
}

h3 {
    font-size: 40px;
    padding-top: 8%;
    margin-bottom: 5px
}

h4,
p {
    font-family: 'Roboto Slab', serif;
    color: #494949
}

#logo img {
    width: 200px;
}

#logo,
li,
img,
.button {
    transition: all 300ms;
    -webkit-transition: all 300ms;
    -moz-transition: all 300ms;
    -o-transition: all 300ms;
}

/*Header************************************/

header {
    width: 100%;
    top: 0;
    left: 0;
    background: #000;
    z-index: 1
}

nav a {
    color: white;
    font-size: 1.5em;
}

nav ul {
  padding: 0;
  margin: 0
}

header nav ul li,
#logo {
    position: fixed;
}

li.top-left {
    top: 0;
    left: 0;
}

li.top-right {
    top: 0;
    right: 0;
    border-color: #000
}

li.bottom-left {
    bottom: 0;
    left: 0;
    border-color: #fff
}

li.bottom-right {
    bottom: 0;
    right: 0;
}

#logo {
    top: 0;
    left: 50%;
    transform: translateX(-50%);
}

/*Home************************************/

#home {
    background: url(img/landing.jpg);
    background-position: center center;
    background-size: cover;
    background-attachment: fixed;
}

#home h1 {
    margin: 240px auto 0 auto;
    font-size: 110px
}

#home h2 {
    margin: 0 auto0 auto;
    font-size: 25px;
}

#home img {
    width: 32px;
    margin-top: 150px;
    opacity: 0.7;
}

#home img:hover {
    opacity: 1;
}

/*About**********************************/

#about img {
    width: 240px;
}

#about img:hover {
    transform: scale(1.1);
    -webkit-transform: scale(1.1);
    -moz-transform: scale(1.1);
    -o-transform: scale(1.1);
}

#about h4 {
    font-size: 25px;
}

#about p {
    width: 700px;
    margin: 0 auto 0 auto;
}

/*WorK***********************************/

#shop {
    background-color: #f0f0f0;
}

#t-shirts {
    width: 900px;
    margin: 0 auto 0 auto;
}

#t-shirts ul {
    padding: 0;
}

#t-shirts ul li {
    width: 33.3%;
    float: left;
    margin-bottom: 15px;
}

#t-shirts img {
    width: 280px;
    height: 170px;
    border-radius: 5px;
}

#t-shirts img:hover {
    transform: scale(1.1);
    -webkit-transform: scale(1.1);
    -moz-transform: scale(1.1);
    -o-transform: scale(1.1);
    box-shadow: 0 5px 5px rgba(0, 0, 0, 0.3);
}

/*Contact********************************/

form input,
textarea {
    font-family: 'Roboto Slab', serif;
    font-size: 15px;
    margin-bottom: 10px;
    border-radius: 2px;
    border: 2px solid;
    border-color: #494949;
    outline: none;
}

form input:first-child {
    margin-top: 10px;
}

form input {
    width: 552px;
    height: 30px;
}

form textarea {
    width: 550px;
    height: 200px;
    resize: none;
}

.input_text {
    color: #494949;
    padding-left: 10px;
}

::-webkit-input-placeholder {
    color: #999999
}

::-moz-placeholder {
    color: #999999
}

::-moz-input-placeholder {
    color: #999999
}

::-ms-input-placeholder {
    color: #999999
}

::-o-input-placeholder {
    color: #999999
}

::input-placeholder {
    color: #999999
}

.button {
    background-color: #f0f0f0;
    color: #494949;
    width: 566px;
    height: 50px;
}

.button:hover {
    background-color: #494949;
    color: #f0f0f0;
}

/*Footer********************************/

footer {
    width: 100%;
    height: 70px;
    background-color: #3f3f3f;
}

footer p {
    font-size: 12px;
    color: #f0f0f0;
    padding-top: 30px;
}
 
Werbung:
Werbung:
sorry für die späte antwort, habs total vergessen.
Ich habs jetzt mal mit dem ?ver=2 versucht. hat aber nichts gebracht.
Also ich seh in meinem screenshot schon das margin und das padding aber halt gräulich :)
Meintest du das?
 
Werbung:
Hallo da draußen,

ich hab vor kurzem angefangen meine eigene HTML Webseite zu bauen.
Jetzt hab ich schon ewig im Internet danach gesucht aber es einfach nicht gefunden...
Wie bekomme ich die einzelnen Nav Komponenten in eine jeweils andere Ecke.
Sprich z.B. Shop links oben, Contact rechts oben, About links unten usw.
(Hab mich an der Homeseite von Travis Scott orientiert :) )

Mein anderes Problem ist, dass ich die Farbe der Schrift dieser Nav nicht ändern kann und sie somit weiß hinterlegen muss.

Hab unten mal paar Screens angehängt falls das hilft :/

Wie gesagt bin erst ein Anfänger und offen zum lernen.
Würde mich über eure Hilfe echt freuen :)

Viele Grüße

Verstehe ich nicht, ich habe deinen Code 1-zu-1 übernommen und bei mir funktioniert es. Kannst Du es online stellen, damit man es sich mit dem HTML-Inspektor ansehen kann?
 
Werbung:
das problem hat sich schon ergeben, siehe früherer chat. Jetzt ist das problem das oben immer ein weißer balken ist und ich diesen nicht wegbekomme.
 
Zurück
Oben