Question: What I have:
============

I have a login form with username and password text box fields. The fields are wrapped in labels.

What I need:
============

I need to remove the text of the labels because I want to apply placeholder values instead.

My code:
========

Note: I've managed to target the breaks but can't target the rendered text of the labels.

```css
label[for=user_login] > br,
label[for=user_pass] > br {
  display: none;
}
```

```html
<p>
  <label for="user_login">Username
    <br>
    <input type="text" name="log" id="user_login" class="input" value="" size="20">
  </label>
</p>
<p>
  <label for="user_pass">Password
    <br>
    <input type="password" name="pwd" id="user_pass" class="input" value="" size="20">
  </label>
</p>
```

I require a CSS-based solution. Editing the mark-up is not an option.

Answer: 
Another idea...You could have the input field lay overtop of the label. This will mitigate potential accessibility issues such as discoverability, screen reader "focus", and possible scrolling caused by moving the label text offscreen when using a screen-reader or switch device.

```css
[for^=user_] > br {
  display: none;
}
[for^=user_] {
  position: relative;
}
input[id^=user_] {
  position: absolute;
  left: 0;
  top: 0;
  margin: 0; //solve for Safari showing a bit of text due to 2px default margin
}
```

```html
<p>
  <label for="user_login">Username
    <br>
    <input type="text" name="log" id="user_login" class="input" value="" size="20">
  </label>
</p>
<p>
  <label for="user_pass">Password
    <br>
    <input type="password" name="pwd" id="user_pass" class="input" value="" size="20">
  </label>
</p>
```
as for your situation that you can't edit the markup, what you can do is just give the input a  
 `margin-left -85px;`  
 so it covers the label and there is no space of where the label was.