# CSS: “float”: X is not a “float” value.

> Canonical HTML version: https://rocketvalidator.com/html-validation/css-float-x-is-not-a-float-value
> Attribution: Rocket Validator (https://rocketvalidator.com)
> License: CC BY 4.0 (https://creativecommons.org/licenses/by/4.0/)

The `float` property accepts only `left`, `right`, `inline-start`, `inline-end` and `none`, and the invalid value that turns up most often is `center`.

A floated element moves to the left or right edge of its container, and the content after it wraps around it. CSS has no `float: center`, because content can't wrap around both sides of a box in the middle. Typos such as `rigth`, and values borrowed from other properties such as `middle`, trigger the same error.

Browsers drop a declaration whose value they don't recognize. The element keeps the `float` it would otherwise have, usually `none`, so `float: center` never centers anything. If an earlier rule floats the element left, it stays on the left.

To center a block, give it a width and set its left and right margins to `auto`. An image already has a width, but it's inline by default, so it also needs `display: block`. To center text and other inline content, put `text-align: center` on the parent. In a flex container, use `justify-content: center`.

## Invalid example

```html
<img src="logo.png" alt="Company logo" style="float: center;">
```

## Valid example

```html
<img src="logo.png" alt="Company logo" style="display: block; margin: 0 auto;">
```
