Avatar billede lefsa62 Seniormester
08. januar 2019 - 21:54 Der er 3 kommentarer

Billeder skaber problem

* {
          box-sizing: border-box;
        }
       
        .row::after {
          content: "";
          clear: both;
          display: table;
        }
       
        [class*="col-"] {
          float: left;
          padding: 15px;
        }
       
        html {
          font-family: "Lucida Sans", sans-serif, 'Times New Roman', Times, serif;
          background-color: #faf8f8;
        }
        h1 {
          font-size: 35px;
          font-family: 'Times New Roman';
          text-align: center;
        }
        h2 {
          font-size: 20px;
          font-family: Arial;
          text-align: left;
        }
        h3 {
          font-size: 20px;
          font-family: Arial;
          text-align: center;
        }
        h4 {
          font-size: 15px;
          font-family: Arial;
          text-align: left;
        }
        h5 {
          font-size: 13px;
          font-family: Arial;
          text-align: center;
        }
        h6 {
          font-size: 13px;
          font-family: Arial;
          text-align: left;
        }

        .header {
          background-color: #c5e1f3;
          color: #ffffff;
          padding-top: 5px;
          height: 120px;
        }
        .header{
        font-size: 30px;
        text-align: center;
       
        }
       
        .header, .highlight, .header .current a{
          color:#e98f76;
          font-weight: bold;
        }
        .nav_top{
          height: 50px;
          background-color:#c5e1f3;
          margin-top: 0px;
          padding-top: 5px;
          margin-bottom: 0px;
        }
        .showcase{
          min-height: 250px;
          background:url("../Image/chow_img1.jpg") no-repeat ;
          text-align: center;
          color: black
          }
     
      .showcase{
        padding-top: 100px;
          margin-top: 0px;
          text-align: center;
      }
     
     
      .dropbtn {
        background-color: rgba(66, 69, 71, 0.623);
        color: white;
        padding: 5px;
        font-size: 13px;
        border: none;
        cursor: pointer;
      }
     
      .dropdown {
        position: relative;
        display: inline-block;
      }
     
      .dropdown-content {
        display: none;
        position: absolute;
        left: 0;
        background-color: #f1f1f1;
        min-width: 160px;
        box-shadow: 0px 8px 16px 0px rgba(0,0,0,0.2);
        z-index: 1;
      }
     
      .dropdown-content a {
        color: black;
        padding: 12px 16px;
        text-decoration: none;
        display: block;
      }
     
      .dropdown-content a:hover {background-color:#ddd;}
     
      .dropdown:hover .dropdown-content {display: block;}
     
      .dropdown:hover .dropbtn {background-color: #dddddd;}
/* datapoletik */
.data_main p{
  text-align: left;
  font-family: Arial;
}
/* Om os*/

.main1{
float: left;
font-size: 15px;
text-align: center;
}
.main1 a{
  font-size: 13px;
}
.sidbare{
  float: right;
}
.sidbare{
  text-align: center;
  font-size: 15px;
}
/* Kontakt  */
.kon_inf a{
  font-size: 13px;
  padding-left: 30px;
  padding-right: 30px;
}
.kon_inf{
  font-size: 15px;
  text-align: center;
}
.button_1{
  height:18px;
  background:#e8491d;
  border:2px;
  padding:0px 20px 0px 20px;
  color:#ffffff; 
}
.quote{
  height: auto;
  background-color: #444444;
  color:white;
  font-family: Arial light;


}

.dark{
  padding: 15px;
  background:#35424a;
  color: #ffffff;
  margin-top: 20px;
  margin-bottom: 20px;
  height: 250px;
}   

     
/* index */
/*.nav_ind{
  height: 50px;
  background-color: #444444;
  color: #ffffff;
  margin: 0 autopx;
  padding: 0px;
}*/
.nav_ind{
  padding: 1rem;
  text-align: center;
  background: #faf8f8;
  color: #333;
}
.nav_ind h3 {
  border-left: dotted 1px #333;
  border-right: dotted 1px #333;
  border-bottom: dotted 1px #333;
  display: inline-block;
  padding-right: 1rem;
  padding-left: 1rem;
  margin: 0px;
}
.services .box{
            height: auto;
            margin: 0px;
            }
.services .box{
            font-size: 13px;
            text-align:center;
            background-color: #faf8f8;
        }
.services, .box{
            text-align: center;
            font-size: 20px;
        }
img{
            border-radius: 20px;
            height: 80px;
            width: 105px;
            margin: 0px;
            padding: 0px;
}

.nav-mid {
      background-color: red;
      height: 300px;
      margin-bottom: 5px;
            }
       
            .nav-mid p{
              font-size: 15px;
            }
img[src="/Image/logo.jpg"]{
              display: block;
              height: 270px;
              width: 250px;
              float: left;
            }
            .aside {
              float: right;
              height: 300px;
              background-color: #c5e1f3;
              padding: 15px;
              margin-left: 5px;
              margin-bottom: 5px;
              color: black;
              text-align: center;
              font-size: 14px;
              box-shadow: 0 1px 3px rgba(0,0,0,10.12), 0 1px 2px rgba(0,0,0,0.24);
            }
/* about */
          .abou_main p{
            float: left;
            font-size: 13px;
            text-align: left;
            padding-left: 30px;
            padding-right: 30px;
          }
          .abou_main{
            text-align: center;
            font-size: 20px;
          }
          .billed, img{
            float: right;
            height: 280px;
            width: 200px;
            padding: 0px;
            margin-right: 45px;
          }
        /* fælles */
        .box1{
          float: left;
          padding: 5px 5px 5px 5px;
          margin: 0px 0px 0px 0px;
          background-color: #dddddd;
          height: 180px;
        }
        .box1{
          text-align: left;
          font-size: 15px;
        }
        .box1 p li{
          font-size: 14px;
          text-align: left;
        }
        .box2 {
          float: left;
          padding: 5px 5px 5px 5px;
          margin:0px 0px 0px 0px;
          background-color: #ffffff;
          height: 180px;
        }
        .box2{
        text-align: center;
        font-size:14px;
        }
        .box2 p{
        font-size:14px;
        }
        .footer{
          text-align: center;
          height:130px;
          background-color: #444444;
          color :#e98f76;
          font-size: 14px;
          padding:0px;
          font-family: Arial light;
        }
        /* For mobile phones: */
        [class*="col-"] {
          width: 100%;
        }
       
        @media only screen and (min-width: 600px) {
          /* For tablets: */
          .col-s-1 {width: 8.33%;}
          .col-s-2 {width: 16.66%;}
          .col-s-3 {width: 25%;}
          .col-s-4 {width: 33.33%;}
          .col-s-5 {width: 41.66%;}
          .col-s-6 {width: 50%;}
          .col-s-7 {width: 58.33%;}
          .col-s-8 {width: 66.66%;}
          .col-s-9 {width: 75%;}
          .col-s-10 {width: 83.33%;}
          .col-s-11 {width: 91.66%;}
          .col-s-12 {width: 100%;}
        }
        @media only screen and (min-width: 768px) {
          /* For desktop: */
          .col-1 {width: 8.33%;}
          .col-2 {width: 16.66%;}
          .col-3 {width: 25%;}
          .col-4 {width: 33.33%;}
          .col-5 {width: 41.66%;}
          .col-6 {width: 50%;}
          .col-7 {width: 58.33%;}
          .col-8 {width: 66.66%;}
          .col-9 {width: 75%;}
          .col-10 {width: 83.33%;}
          .col-11 {width: 91.66%;}
          .col-12 {width: 100%;}
        }
        #hallo{
            max-width: 1150px;
            margin: auto;
            }
Jeg har lagt min css ud her
og i kan se problemet på tordvin.dk at Billeder laver de runde kanter når kun de tre på stribe skal have det
Avatar billede Slater Ekspert
08. januar 2019 - 22:04 #1
Jamen du har jo en regel der siger

img{
            border-radius: 20px;

Dvs. du har med vilje sat alle billeder til at have runde kanter, og undrer dig over hvorfor alle billeder har runde kanter?
Avatar billede lefsa62 Seniormester
08. januar 2019 - 22:18 #2
Det er ikke min mening. det tre skal have den samme men de andre skal være uafhængig a hinanden.Når jeg fjerner kommaet så forandres de alle . hvad gør jeg forkert
Avatar billede lefsa62 Seniormester
08. januar 2019 - 22:38 #3
nu har jeg sat en punktum foran img hører til de tre billeder så kan du se hvad det sker
Avatar billede Ny bruger Nybegynder

Din løsning...

Tilladte BB-code-tags: [b]fed[/b] [i]kursiv[/i] [u]understreget[/u] Web- og emailadresser omdannes automatisk til links. Der sættes "nofollow" på alle links.

Loading billede Opret Preview

Log ind eller opret profil

Hov!

For at kunne deltage på Computerworld Eksperten skal du være logget ind.

Det er heldigvis nemt at oprette en bruger: Det tager to minutter og du kan vælge at bruge enten e-mail, Facebook eller Google som login.

Du kan også logge ind via nedenstående tjenester