möchte nur Bildern in einem bestimmten DIV Rahmen mit CSS geben, andere nicht

josef56

Grünschnabel
Hallo zusammen

Ich bin neu hier und bin mit CSS noch Anfanger.
Ich möchte mit DreamweaverCC und fliessendem Rasterlayout meine Webseite umbauen.
Ich beginne CSS langsam zu verstehen. Habe verstanden, dass ich jedem DIV ein Verhalten zuordnen kann, wie Schrift, Hintergrund und alles möglich zu reagieren hat.

Komme aber leider nicht mehr weiter.

Beispiel:

DIV2 füge ich ein Bild ein, welches KEINEN Rahmen erhalten darf.
DIV3 werden mehrere Bilder eingefügt, welche einen Rahmen von 1 px haben sollen.

Ich erhalte einfach immer bei allen Bildern, also jenem in DIV2 und allen in DIV3 den Rahmen, möchte aber zwingend bei DIV2 keinen Rahmen. Ich kriege es nicht hin, dass die Eigenschaft für den Rahmen im DIV3 festgesetzt wird.

Habe ein kleines Beispiel gemacht und füge das CSS ein.

Würde mich freuen, wenn mir jemand helfen könnte.

Danke
CSS:
@charset "utf-8";
/* Simple fluid media
   Note: Fluid media requires that you remove the media's height and width attributes from the HTML
   http://www.alistapart.com/articles/fluid-images/ 
*/
img, object, embed, video {
	max-width: 100%;
	border: 1px solid #000000;
}

/* IE 6 does not support max-width so default to width 100% */
.ie6 img {
	width:100%;
}

/*
	Dreamweaver Fluid Grid Properties
	----------------------------------
	dw-num-cols-mobile:		9;
	dw-num-cols-tablet:		12;
	dw-num-cols-desktop:	12;
	dw-gutter-percentage:	25;
	
	Inspiration from "Responsive Web Design" by Ethan Marcotte 
	http://www.alistapart.com/articles/responsive-web-design
	
	and Golden Grid System by Joni Korpi
	http://goldengridsystem.com/
*/

.fluid {
	clear: both;
	margin-left: 0;
	width: 100%;
	float: left;
	display: block;
}

.fluidList {
    list-style:none;
    list-style-image:none;
    margin:0;
    padding:0;        
}

/* Mobile Layout: 480px and below. */
  
.gridContainer {
	margin-left: auto;
	margin-right: auto;
	width: 88.9777%;
	padding-left: 1.0111%;
	padding-right: 1.0111%;
	clear: none;
	float: none;
}
#div1 {
}
#div2 {
	font-family: Gotham, "Helvetica Neue", Helvetica, Arial, sans-serif;
	text-align: center;
	font-size: x-small;
}
#div3 {
	background-image: -webkit-linear-gradient(270deg,rgba(255,255,255,1.00) 0%,rgba(159,159,159,1.00) 100%);
	background-image: linear-gradient(180deg,rgba(255,255,255,1.00) 0%,rgba(159,159,159,1.00) 100%);
	font-family: Gotham, "Helvetica Neue", Helvetica, Arial, sans-serif;
	font-size: x-large;
}
#div4 {
}
#div5 {
}
 
Zuletzt bearbeitet von einem Moderator:
Du gibts oben allen Bildern, egal wo sie liegen, einen Rahmen.
Probier einfach mal:

#div2 img {
border: none;
}

Damit sollten die Rahmen der Bilder im jeweiligen Container verschwinden.
 
Zuletzt bearbeitet:
Zurück