Can someone show me how to get my CSS code to work more than once? [closed]


Tags: html,css,drawing

Problem :

Currently, I have 2 divs, each with a CSS class. They are directly below eachother in the HTML file, and have the identical code. The only difference between the two is the id and class names. Here's the code for the HTML:

<div class="myCircle" id="myCircle" top="0px">
</div>
<div id="touchbutton" class="touchbutton" top="0px">
</div>

And the CSS:

.myCircle {
  position: absolute;
  width: 65px;
  height: 65px;
  margin: 0px auto;
  background-color:#ff0829;
  -webkit-border-radius: 32.5px;
}

.touchbutton = {
  position: absolute;
  width: 65px;
  height: 65px;
  margin: 0px auto;
  background-color:#ff0829;
  -webkit-border-radius: 32.5px;
}

The problem is that only one of the circles is appearing, myCircle. When I make touchbutton of class myCircle, it shows up, but not when it is class touchbutton. Is there something in CSS that I'm missing?



Solution :

Remove the = between .touchbutton and the {.

Also, based on how you have the positioning set up they're going to be stacked on top of one another (unless you're setting left: or right: somewhere else). I'd remove the top attribute from within the HTML and remember to set different positions in the classes.


    CSS Howto..

    How to get Facebook Like Box “Dark Scheme” to work correctly? (Background is transparent.)

    How to show current page using CSS? .current_link not working

    What's causing my hover image not to show it's transparency? [closed]

    How to center an absolutely positioned item in CSS

    How to resize the images to have the same height in group while keeping aspect ratio?

    How to use Javascript to get a visitors monitor resolution?

    How do I get JavaScript to clear the previous onclick element when a user moves on to the next click?

    How do you tell which css class to modify?[Example inside]

    How to make google maps fit the mobile device screen

    How to create a 3 column (ul, li) header that (responsive) collapse one below another?

    How to Have the Div Aligned to the Middle, and That Relative to the Parent Div?

    How to debug CSS/Javascript hover issues

    How do I get user-inputted information from the website directly to my e-mail?

    How to Center a image with HTML CSS

    How do I add a css class to an Div element in JQuery?

    How can I use min-width 100% and still have expanding by content?

    How to style a SVG using CSS in javaFX FXML

    css top nav - left nav (menu), title in center, right side (more buttons) - howto?

    How do you solve this Chrome button border bug?

    How to inherit css from grandparent tag? [duplicate]

    How to use HTML and CSS as a Java application GUI?

    How to format HTML/CSS to align with single word in sentence?

    How do I use pseudo-classes to select all children except first and last?

    How to put a background video loop on a website HTML/CSS

    How make contents as a grid in a ScrollPanel in GWT project using UIBinder

    how to switch to another view using css class on click in angularjs using ngclass

    How to match element containing another element?

    How to make a smoother animation with jQuery UI slide effect

    How to increase the distance between table columns in html?

    How to make sure that dynamic DOM elements have correct css using jQuery mobile