Question 417128 in Html Question posted in
Some basic documentation can be found here.

Html – Transparent color like a solid color

so i have a little problem with css

i want to set transparent color with properties like a solid color
a solid black color on, for example: on 50% of a div with a text, the text disappears and it paints 50% black, well I would like to achieve the same but with the transparent color
What I mean by the text disappearing is that I am using the pseudo css element ::after

Here an image of i want:
enter image description here

Another way to say this, is, If my inset property covers 50% of my div, ok delete that 50% or make it transparent

if you still dont understand, feel free to ask!

thanks!

Tags:

2

Answers


  1. 0

    I think you’re trying to make an element like a switch div that changes color between black and transparent on state change. you can put 2 divs inside the div and change the color of each separately even if you are trying to make the black color seems to be moving between the divs you can make 2 linear gradient moving to the side.

    Hope this Helps 🙂

    Login or Signup to reply.
  2. 0

    Can you explain the style you want in a bit more detail? ( try using AI for translation if you have problem in describing it in english )

    only part I understand right now is that you want a setting portion of div has black color and other half is transparent which can be achieved as follows

    <body style="background-color: pink;">
  <div class="main-div" style="display: flex;width: 324px; height:40px;border:2px solid red; position: relative;">
    <p style="position: absolute; left: 0; width: 100%; color:white; font-size: 20px;">This is some random text for testing</p>
    <div class="black-div" style="width: 50%; background-color: black">

    </div>
    <div class="transparent-div" style="width: 50%; background-color:pink;">
    </div>
  </div>
</body>

    Pay main attention to display: flex, position:relative, position: absolute.

    enter image description here

    Login or Signup to reply.
Please signup or login to give your own answer.

Back To Top
Search