Custom CSS issue – override existing CSS

  • jgessentials

    (@jgessentials)


    7 years, 3 months ago

    Hi,
    I am not a developer and have somewhat limited knowledge of css. I am making some tweaks to text centered on on image.

    Here is my additional css added in the customizer:

    .image-block h3 {
	font-family: "Raleway";
	font-size:1em;
	letter-spacing: .1em;
    font-weight: 600;
margin: 0;
    background: white;
    position: absolute;
display:inline-block;
    top: 50%;
    left: 50%;
    margin-right: -50%;
    transform: translate(-50%, -50%);
			padding: 0.5em 1em;
}

    However some of the original css remains active – illustrated here by items in bold:

    .image-block h3 {
   <em> background: #fff;
    padding: 0.7em 1em;
    margin: 0 auto;</em>
   <strong> max-width: 180px;</strong>
    <em>position: absolute;
    left: 0;</em>
   <strong> bottom: -21px;
    right: 0;
    width: 100%;</strong>
}

    How can I get rid of bottom, right and width completely? Setting them to 0px does not achieve the result I am looking for.

    Thank you for your help.
    Julien

Viewing 1 replies (of 1 total)
  • Jacob Peattie

    (@jakept)

    7 years, 3 months ago

    To reset the values of those properties to their defaults you need to use the following values:

    max-width: none;
width: auto;
right: auto;
bottom: auto;
    • This reply was modified 7 years, 3 months ago by Jacob Peattie.
Viewing 1 replies (of 1 total)

The topic ‘Custom CSS issue – override existing CSS’ is closed to new replies.