NickSS
NickSS

Reputation: 35

Internal CSS not overriding external CSS for class

I need my "column" class in the internal CSS to float center while the external CSS has it set to left.

Here is my CSS file:

body { text-align: center; font-family: Verdana, Geneva, Arial, Helvetica, sans-serif; }  
#report { width: 1269px; margin:  auto; float: left;
}

div.column{  margin-top: 10px; padding: 0px 0px; float: left; }
div.first{ padding-right: 8px; border-right: 1px grey solid; }
div.second{  margin-left: 8px; 
}
...

Here is my HTML with internal CSS:

    <!DOCTYPE html>
<html>
<head>
<title>Dual Server Report</title>
<link rel="stylesheet" type="text/css" href="ServerReport.css">
    <style type="text/css">
    div.column{ float: center; }
    </style>
</head>
<body>
<div id="report">
<h1>Automated PowerShell Install Report</h1>
<h2>This report was ran: 07/07/2015 09:03:21</h2>

    <div class="column">
...

I checked out these three similar questions but nothing I tried worked.
Internal Stylesheet NOT overriding External stylesheet?
“Inner” CSS Not Overriding “Outer” CSS
Overriding External CSS

Edit:
I remembered looking up the "float" property yesterday but I did not remember what I found; I feel pretty silly for posting this before going to double check. It makes sense that float would not have a center property.

I'll leave this up in case anyone in the future makes a similar mistake. Thanks to everyone who answered for being so respectful in pointing out this error I should have found on my own.

Upvotes: 0

Views: 578

Answers (3)

waders group
waders group

Reputation: 538

There is nothing like float: center in CSS

Another way to do it

Change your CSS under the html page

div.column
{
 float: none;
 margin: auto;
 width: 200px; /* set the width (Except 'auto') */ 
}

Upvotes: 0

Jacques Cornat
Jacques Cornat

Reputation: 1642

The property value of float: center does not exist.

The float property has four values: left, right, none, and inherit.

Upvotes: 3

mad_manny
mad_manny

Reputation: 1091

The only valid values for float are: left, right, none, inherit.

So this code will be skipped and not override the css file. Please look here for more information on the float property.

Upvotes: 0

Related Questions