Want to win a PS4? Go Premium and enter to win our High-Tech Treats giveaway. Enter to Win







Cascading Style Sheets (CSS) is a language used for describing the look and formatting of a document written in a markup language. Usually used to change web pages and user interfaces written in HTML, it can also be applied to any kind of XML document. CSS is designed primarily to distinguish the content of a document from its presentation.

Share tech news, updates, or what's on your mind.

Sign up to Post

How to get horizontal line below the top header title in SharePoint 2013 site on every site and subsite. I'm using custom css file and using in the master page but have no luck in putting a horizontal line below the Title of the Site or sub-site.
Ask an Anonymous Question!
LVL 10
Ask an Anonymous Question!

Don't feel intimidated by what you don't know. Ask your question anonymously. It's easy! Learn more and upgrade.

Hi guys, i was wondering what is the best way to remove dates from all posts

You can see the date here

I was wondering if someone knows a script or could help get me started with a script (jquery, jquery mobile, javascript, CSS or combination) that simulate what the attachment shows. Basically, if they select an item to order it should appear in one window and the items to select from should be in the other window and some sort of animation should indicate that is happening. It is a phone interface but the click event should be able to make it useful from a regular web window. Thank  you.
Hello, i am learning to create a App using https://github.com/MicrosoftEdge/JSBrowser . You can see on github have .sln to we create own browser.
I want to CSS Google.com with javascript but i dont know how to write code and embed it.

Exp: i wrote a script  document.getElementsByClassName('jsb')[0].style.display="none"

'jsb' is a class contain Google Search Button + I'm feeling lucky Button
Thank you so much, regards!!!!!
I'm skewing the border of a DIV so that I can create a parallelogram border around text.
I don't want the text skewed, but I can't figure out how to "un-skew" it.

This code is from a WordPress website - I'm using a plugin called Visual Composer.

The code works, the border is skewed as I want - but the text inside is also skewed.

Any help would be appreciated.

Here's my css:

.p_gram_button {
  -webkit-box-sizing: content-box;
  -moz-box-sizing: content-box;
  box-sizing: content-box;
  width: 100px;
  height: 30px;
  border-style: solid;
  border-color: #f36e21;
  color:#fffff !important;

  -o-text-overflow: clip;
  text-overflow: clip;
  -webkit-transform:    skewX(-20deg);
  transform:    skewX(-20deg);

.p_gram_button p{
font-style: normal !important; 

<!-- HTML -->
<div class="vc_wp_text wpb_content_element p_gram_button">
	<div class="widget widget_text">			
		<div class="textwidget">
		<p><span class="inner_text_p">More Details</span></p>

Open in new window

Hi there. I'm trying to center-align the 3 circle images and captions under them over mobile but not having much luck. Here is my page... http://machebeuf.org/future

Any ideas experts?
I have this table in my app, and I need to be able to get a hover effect on just one of the 5 columns (the one to the far right).

I have managed to get a hover effect per row in the table, and I wonder if it is possible to restrict this to just one column.

This is the CSS to the hover effect as it is now.

 table tr:hover {background-color: cornflowerblue;}

Open in new window

This is an example of the table.
I hope that someone have the golden idea :)
I have a Powershell script that creates a html page, that ends up looking like this in ie. Chrome and IE:
But when I insert the source code in an email, it looks like this in Outlook:
The reason is pretty clear - Outlook doesn't understand som of the CSS.
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN"  "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
BODY{background-color:white;}TABLE{border-width: 1px;border-style: solid;border-color: black;border-collapse: collapse;}
TH{border-width: 1px;padding: 0px;border-style: solid;border-color: black;background-color:#4368a0;padding-left: 10px;padding-right: 10px;color: white}
TD{text-align: right; border-width: 1px;padding: 0px;border-style: solid;border-color: black;padding-left: 10px;padding-right: 10px;text-transform: uppercase;}
tr:nth-child(odd) {background-color: #a3bbe0;}
tr:last-child { background:#b5b5b5;font-weight: bold;border-top: 2px solid black}
td:first-child { background:#b5b5b5;text-align: left;}td:last-child { background:#7eb27c;}

Open in new window

This is so simple but I can't find how to do it. I want to make 3 images and description appear on the same row inside a DIV, but I've tried several times and I get them BUT LIKE A LIST, one below each other !
I would like :

Image text                    image text                   Image text
           more  text                     more text

<div class="row">
  <div class="col-sm-12">
I want to display all data ( row wise ) of  a particular person (fetched from MYSQL table )  and implement edit and delete  button in front of each row.

i am attaching file of table whose data to be fetched and displayed
Industry Leaders: We Want Your Opinion!
Industry Leaders: We Want Your Opinion!

We value your feedback.

Take our survey and automatically be enter to win anyone of the following:
Yeti Cooler, Amazon eGift Card, and Movie eGift Card!

Hi Guys,
I have a problem with bootstrapt\dropdown-menu and overflow.
I am using the dropdown-menu class inside overflow to return list on one row table and when the list is long it doesn't show all the menu.
I would like to show the full menu even when my overflow comes small.

Here is some link I found with my same problem, but still I couldn't fix it.
Hello Experts,

Here is my situation, I have a list of categories, my users can list their products but I have 3 categories I want them to be untouched or disabled for them to select. "Hot deals" "Ending Soon" "New deals" I want these to be exclusive to the admin from the backend, I'm using Prestashop, I need technical help with coding solving.

The page is using jstree, is there anyway I can hardcode the value to disable the checkbox on those categories?

check screenshot

thank you

See the grey border around the document (circled in red)?  How can I get rid of it?

I think the border might be part of the styling for the linked google document I have embedded in the webpage.  So I need to wait to attempt the removal until AFTER the embedded page has completed loading.

Could use some help.  I am thinking about a jQuery solution and prefer that.

grey border kill
hello, our aging hotel software fidelio suite8 is running reports from an old Crystal Report ver 8.5 / 2012 runtime also (?).  I can send simple formatted email / reports made from Crystal in *.rpt format.

I would however like to use the latest (or at the very least, modern) newsletter formats with css etc. I would like to find out whether this be possible? Inline? or html?

My bottom line is to send a welcome letter / goodbye letter - the email format / structure will not change much. The email server is in-house.

Thanks for helping, Clifford
Hi ,

I am creating a simple component in Angular 4

-my-account  // angular project folder
----account  // angular component folder

//css , js , images are folders I created and put files.

Now I want to use css files from the above css folder in account.component.html.  How do I access ?

Here is my non working code

 <Link href="css/datatables.min.css" rel="stylesheet" type="text/css"/>
 I'm getting error
 zone.js:2744 GET http://localhost:4200/css/datatables.min.css 404 (Not Found)

please note this file is already present in css folder.
Do you have any suggestion how to access css files in component html   ?  what is the proper way to fix ths issue ?
Need help
I want to have the effect to disable further update (like to show gray background color), to whole page, when it's being idle for a while, by these

        .overlay {
            background: #e9e9e9;
            display: none;
            position: absolute;
            top: 0;
            right: 0;
            bottom: 0;
            left: 0;
            opacity: 0.5;
$(function () {
    // 1000ms=1s, here test use 10s, you could modify. 
    var time = 5000;
    var set = setInterval(function () {
    }, time);
    <div class="overlay">
        <div id="loading-img">

Open in new window

but I cannot get what I want, below

what to adjust?
I have a slider and some text on my website.  There is a background image behind the slider and text.  I am having trouble making the elements scale correctly in mobile layouts.  I was wondering what is the best way to achieve this without having to make tons on media queries for each size?


Thanks!  Any help would be greatly appreciated.
I need a responsive theme for the now unsupported Magento Professional ver.

There are many themes out there but I can't find anything that says it supports Magento ver.  Ideally, I'd like something that is free.

If this does not exist, is there a reasonably easy way to adapt other designs to 1.10?
Hi Experts

I am trying to use the css function @media print to print the content in <div class="test"></div>. With this code it works.

<style type="text/css">
@media print {
body * {
.test {

I placed that code in the <head> section. When I tried to code it into an external CSS, it doesn't work. I have this link to my external CSS:
<link rel="stylesheet" type="text/css" media="screen" href="test.css">

Does it mean that @media print has to be coded into <head> section while using the external CSS link will not work? Thanks
Enroll in October's Free Course of the Month
LVL 10
Enroll in October's Free Course of the Month

Do you work with and analyze data? Enroll in October's Course of the Month for 7+ hours of SQL training, allowing you to quickly and efficiently store or retrieve data. It's free for Premium Members, Team Accounts, and Qualified Experts!

I am currently in the process of creating my online portfolio and I am having difficulties with my burger menu icon toggling the off canvas menu.  I've managed to set it to open but when I click it again to close it doesn't work.
The problem i am having in alignment of input and select fields. html and css code is attached. I am having hard time for resolving this as i am beginner in css learning.

Select fields for choosing time       from    [hour] [minutes]              to     [hour][minutes]  should be easily understood by user. right now it is not so.
Page is divided into two parts  - > left and right side.  left side's width is 60% and right side's is 40 %.

Form is in the left side. (which is to be consider)
whenever i leave focus from dropdown then dropdown showing highlighted along with all other dropdowns on that page in asp.net web application
need play pause stop buttons for carousel.
Im trying to build a windows start-menu style page, where the page scrolls to the right instead of down. My biggest issue is to stop the page flowing down with the scroll bar, and then to float up and to the left scrolling over to the right instead of down. But if there are 2 divs and enough space to be underneath.

Does this make sense?
Has anyone used a tool to remove unused CSS classes.

Chrome Audit is supposed to do it but it doesn't list the classes, also tried the Lighthouse plugin with same no results.

Have also tried the Firefox Duster but its not supported in the later versions.

This has to run locally on my Dev PC, so no web tools.







Cascading Style Sheets (CSS) is a language used for describing the look and formatting of a document written in a markup language. Usually used to change web pages and user interfaces written in HTML, it can also be applied to any kind of XML document. CSS is designed primarily to distinguish the content of a document from its presentation.