Verwandte Themen

verreisterNutzer
15.11.2020, 19:28
Mit Bildern
Abgerundete Ecken CSS sind abgeschnitten (Grid-Box)?

Hallo,

ich hab erst vor angefangen HTML und CSS zu lernen und bin jetzt auf folgendes Problem gestoßen:

Ich möchte eine Webseite via CSS-Grid aufteilen und die Boxen jeweils abrunden. Allerdings werden manche Ecken immer abgeschnitten und ich finde nicht den Fehler an was das liegen könnte (siehe Screenshot, ecken rot Markiert). Hier der Code den ich bis jetzt verwende:

.gridbox{
  overflow: hidden;
  width: 99%;
  height: 99%;
  display: grid;
  grid-template-columns: 25% 25% 25% 25%;
  grid-template-rows: 25% 25% 25% 25%;
  grid-template-areas:
      "nav nav nav nav"
      "sidebar main main main"
      "sidebar content1 content2 content3"
      "sidebar footer footer footer";
  grid-gap: 0.4rem;
  border-radius: 1rem;
}

#nav {
  background: #a7ffeb;
  grid-area: nav;
  border-radius: 1rem;
}

#sidebar{
  background: #18ffff;
  grid-area: sidebar;
  border-radius: 1rem;
}


#main {
  background: #84ffff;
  grid-area: main;
  border-radius: 1rem;
}


#content1 {
  background: #6fffd2;
  grid-area: content1;
  border-radius: 1rem;
}


#content2 {
  background: #64ffda;
  grid-area: content2;
  border-radius: 1rem;
}


#content3 {
  background: #73ffbb;
  grid-area: content3;
  border-radius: 1rem;
}


#footer {
  background-color: #1de9b6;
  grid-area: footer;
  border-radius: 1rem;
}

Soweit ich das verstanden habe, spricht man wenn man bei border-radius: 1px 2px 2px 1px; die Ecken einzeln an und bei border-radius: 1rem; alle Ecken.

Danke für Antworten :D

Bild zum Beitrag
Computer, Technik, HTML, Webseite, CSS, Informatik
3 Antworten
GreyForest
09.11.2020, 14:14
Beitrag wurde 1 Mal erneut eingestellt
Mit Bildern
Probleme bei iPhone 12 Lieferung - Hilfe?

Hey,

ich habe mir vor kurzem (naja mittlerweile schon vor mehr als 3 Wochen) das neue iPhone 12 bestellt... mein erstes iPhone bin schon ziemlich aufgeregt☺️...

Das Problem: Das Handy sollte zwischen dem 03. und 10 November ankommen. Nun habe ich gerade eben einen Screenshot des Bestellstatus auf der Apple-Website gemacht und man sieht, dass der Versand noch nichtmal vorbereitet wird... das Handy kommt also definitiv nicht mehr morgen an. Allgemein hat sich der Bestellstatus nicht mehr geändert seitdem ich die Lieferadresse verändert habe... Meine Frage: Was genau ist da los? Wann kommt mein Handy dann denn an, damit ich da bin um es zu empfangen? Habt ihr Erfahrungen oder selbst schon ein iPhone 12 online bei Apple bestellt?

Meine zweite Frage: Meine Hausnummer ist 7/3... Beim Bestellen hat Apple daraus jedoch nur die Hausnummer 7 und Raum 3 gemacht (sowohl bei der Rechnungs- als auch bei der Lieferadresse)... Ich hatte erstmal Angst, dass meine Lieferadresse nicht mehr stimmt und habe diese dann darauf von ... 7 Raum 3 in 7/3 umgeändert (hier gab es keine Probleme)... allerdings ist die Rechnungsadresse noch 7 Raum 3 (die kann man nicht mehr ändern)... Auf der Apple-Website steht jetzt, dass Rechnungs- und Lieferadresse idealerweise gleich sein sollten.

Kann es sein, dass die Änderung der Lieferadresse eine Verzögerung ausgelöst hat, da Apple erst prüfen muss ob meine Rechnungsadresse echt ist bzw. mit der des Kreditkartenunternehmens identisch ist (da steht ja auch 7/3 und nicht 7 Raum 3)? Ich bin echt verwirrt 🤷‍♂️... Ich freue mich doch so sehr auf das Handy...

Ich würde mich riesig freuen, wenn ihr mir da helfen könntet oder Ideen hat an was es liegt bzw. was ich machen kann... ich weiß Support anrufen wäre die letzte Lösung... aber vielleicht hat hier ja jemand echte Erfahrung... den Support würde ich dann eh erst morgen anrufen, damit die nicht sagen können ich solle doch noch einen Tag warten...

Schonmal riesen Dank im Voraus☺️

Bild zum Beitrag
Apple, iPhone, Handy, Versand, Smartphone, Online-Shop, Webseite, Apple Store, Bestellung, iPhone 12
3 Antworten
LopLop88
08.11.2020, 21:29
Mit Links
Website?

Hallo

Ich habe direkt 2 Fragen:

  1. Wieso ist um diese Navbar ein weisser Balken?
  2. Wenn ich über die Links(in der Navbar) hovere wird nur ein kleiner Hintergrund helleres blau. Jedoch möchte ich das von der Höhe die ganze Navbar helleres Blau wird. Wie kann ich dass machen?

Bei Fragen melden. Vielen Dank im Voraus

Lg Luca

CSS:
body{
    font-family:sans-serif;
    font-size: 16px;
}


/* Navbar */
.topnav {
    background-color: #1E262D;
    overflow: hidden;
  }


/* Logo Navbar */
.logonav{
    width: 20%;
    height: 20%;
    min-width: 120px ;
    min-height: 91px;
}
  
  /* Links */
  .topnav a {
    float: right;
    display: block;
    color: #f2f2f2;
    text-align: center;
    padding: 16px;
    text-decoration: none;
    margin-top: 2%;
    margin-bottom: 2%;
  }


  /* Links Hover */
  .topnav a:hover {
    background-color: #2C3E50;
    background-size: 100%;
  }
  
  .topnav .icon {
    display: none;
  }


  /* Media Queries  */
@media screen and (max-width: 600px) {
    .topnav a:not(.child) {display: none;}
    .topnav a.icon {
      float: right;
      display: block;
      background-color: #1E262D;
      color: #ddd;
    }
  }
  
@media screen and (max-width: 600px) {
    .topnav.responsive {position: relative;}
    .topnav.responsive a.icon {
      position: absolute;
      right: 0;
      top: 0;
      background-color: #1E262D;
      color: #ddd;
    }
    .topnav.responsive a {
      float: none;
      display: block;
      text-align: left;
    }
  }








HTML:
<!DOCTYPE html>
<html lang="en">


<!--Head-->
  <head>
    <meta charset="utf-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Responsive</title>
    <link rel="stylesheet" href="style.css">
    <link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/4.7.0/css/font-awesome.min.css">
    <script src="java.js"></script>
  </head>
<body>


<div class="topnav" id="myTopnav">
  <!--<img src="logoblue.png" alt="logo" class="logonav">-->
  <a href="contact.html">Contact</a>
  <a href="portfolio.html">Portfolio</a>
  <a href="index.html" >About me</a>
  <a href="javascript:void(0);" class="icon" onclick="myFunction()">
    <i class="fa fa-bars"></i>
  </a>
</div>


  </body>
</html>
Computer, Internet, HTML, Webseite, Design, CSS
2 Antworten

Meistgelesene Beiträge zum Thema Webseite
Mehr meistgelesene Fragen zu Webseite