CSS Target Class that Starts or Ends With Value

Target unknown/incomplete CSS class.

CSS Target Class that Starts with Value

CSS [attribute^=value] Selector

Example

div[class^="starts"] p {
margin: 0 0 12px 0;
}

Sets a margin on all <p> elements that have a parent <div> class attribute value that starts with “starts” e.g. ‘.starts-content’

CSS Target Class that Ends With value

CSS [attribute$=value] Selector

Example

div[class$="ends"] p {
margin: 0 0 12px 0;
}

Sets a margin on all <p> elements that have a parent <div> class attribute value that ends with “ends” e.g. ‘.content-ends‘

About the Author

Glenn

A highly experienced Web Designer / Web Developer (Webflow, WordPress, Weebly & Custom), Front-end / Back-end Developer & New Media Specialist, with extensive knowledge of a wide spectrum of technologies in the Development and Creative Industries, built up over a number of years.