Removing an Object with CSS

One of the most popular tasks that re-occurs in web development is removing objects from a page. This object(s) may not be able to be removed easily through an HTML editor interface and that is where CSS comes in. Removing an object with CSS requires the element name that contains the object to be removed.

To discover what the element is controlled by, we can use Developer Tools in Chrome. To get there, navigate to the page you want to edit and right click on the page. Scroll to the bottom of the options menu and select “Inspect Element.” This will pop up a code screen at the bottom that will highlight the different parts of the page and show the corresponding code elements. Click and drag to highlight the object to be removed and then check the code below to see the name of the div id or div class that controls that object.

Once it is discovered, go to the style sheet for the site, or write the CSS inline.

DIV ID’s:

#element {
display: none;
}
-or-
DIV CLASSES’s:
.element {
display: none;
}

Replace the word “element” above with the ID or CLASS name we discovered earlier that was around the exiting object. Now save and check the page to see if the object is removed. If this doesn’t work, check the code to see if any errors have occurred in the typing.

If the object cannot be removed through above method, then it may be possible to write a DIV ID and reference it to the display:none; CSS. To do this it will be necessary to locate the file that the object to be removed is inside. Go to the object and write the following code around it:

<div id=”objectremove”>
–this is the object to be removed–
</div>

Then we will reference that element either in the external style sheet or in the same page using internal CSS. The internal CSS would look like such:

<style>
#objectremove {
display: none;
}
</style>

<div id=”objectremove”>
–this is the object to be removed–
</div>

Hope that helps remove any pesky parts of your site!

Have something to add to this tutorial? Share it in the comments.

Written by: Jophiel Silvestrone

Jophiel Silvestrone has written 326 posts in the Tech Blog.

Jophiel grew up on a ranch in Paradise Valley, Montana near Chico Hot Springs. Working on the ranch instilled work ethic and self motivation. Filled with this drive, Jophiel started mowing the local school's yards twice a month throughout the summers, at the age of 12. He moved to Billings in 2004, where he has been deeply involved in the local business community ever since. A serial entrepreneur, Jophiel has ran multiple businesses in our local community. The first business, a janitorial and carpet cleaning company, founded in 2005, has employed over 50 locals. Moving on to the media industry, Jophiel and several partners founded Green Directory Montana in the spring of 2007. Green Directory's sustainability ranking software awarded points based on sustainable or "green" actions. These points counted towards a business's total "Green Score," which in turn ranked them against other businesses in their category and throughout the entire site. It also featured a limited edition print version distributed annually. A business acquisition allowed Jophiel to focus on new projects, and a few close business colleagues and Jophiel started Rocky Mountain Mr. & Ms. Magazine, a lifestyle publication for men and women in the Magic City. After a year and a half at the helm of RM3 Magazine, the business was purchased. He now runs a web development company SkyPoint Studios and fathers his son Jaoquin, who plays football, basketball, soccer, and is learning snowboarding from his dad. Recently, has expanded to locations in Havasu, Arizona & Vegas. SkyPoint Studios is a market leader in both Billings & Havasu and Jophiel is working on building that same level of market dominance in Vegas. Specialties: Extensive experience in online and offline business. Especially savvy at WordPress, and operate several sites, one example is the blog: skypointwebdesignbillingsmontana.com/tech-blog. Check out skypointwebdesignbillingsmontana.com for the latest projects from SkyPoint Studios.