Closed. This question needs details or clarity. It is not currently accepting answers.
Want to improve this question? Add details and clarify the problem by editing this post.
Closed 8 years ago.
Improve this question
I am wondering I can disuse global button css style property for one button which need to be
styled its own way. is there any way to disfunction button{} style in one button?
Yes you can! you can set an id or a class to the button that you want to style and write whatever style you want, e.g:
<button id='mybutton'>Click</button>
In you css file:
#mybutton { you style here... }
Create a new class and add it to your button.
<button class='button2'>Click</button>
Manually set all attributes within your css file.
.button2{ style here... }
Related
Closed. This question needs details or clarity. It is not currently accepting answers.
Want to improve this question? Add details and clarify the problem by editing this post.
Closed 3 years ago.
Improve this question
I am using the Discy Wordpress theme.
What css code could I use to hide the share button and author's name from the post loop only.
Here is a screenshot of what I would like to hide
I'd recommend inspecting the elements you want to hide in your browser and add display: none to the class/id on those elements.
Ex. Say I want to hide the 'Your Answer' text here.
I would then add some CSS
h2.space {
display:none;
}
Edit:
Based on your needs there are a couple options:
Edit the templates used by Wordpress to exclude these elements on the necessary pages.
or
Insert some jQuery that will hide the elements on a specific page.
$(document).ready(function() {
if (window.location.href.indexOf("home") > -1) { // What the url contains on the page you don't want these elements to display
$( "h2.space" ).addClass( "hidden" );
}
}
Of course, this solution requires jQuery and a hidden CSS class defined, like:
.hidden {
display: none;
}
Some sort of class like that may already be defined in the Wordpress theme you're using.
Fiddle for this solution: https://jsfiddle.net/p6af32td/
Closed. This question needs debugging details. It is not currently accepting answers.
Edit the question to include desired behavior, a specific problem or error, and the shortest code necessary to reproduce the problem. This will help others answer the question.
Closed 3 years ago.
Improve this question
I have two css file for arbaic layout and english layout , so I want to conditionally change the styleurl in component . is possible or not
?
you cannot put a condition in the styleUrls attribute of the component, but instead, you can use something like that:
.some-class {
// your css style
}
// arabic css overrides
._ar {
.some-class {
direction: rtl;
}
}
<div class="parent" [class._ar]="your_condition">
<textarea class="some-class">
</textarea>
</div>
Closed. This question needs details or clarity. It is not currently accepting answers.
Want to improve this question? Add details and clarify the problem by editing this post.
Closed 5 years ago.
Improve this question
In WooCommerce, for my variable products, How can I add a (gap) between woocommerce product page "Choose an option" button and "Quantity + Add to cart button"?
Here an explicit screenshot:
Edit: Here is a live link: http://www.noushasasart.com/product/harsh-bark/
Yes, I have moved the single "Add to cart" button just after the product title.
This seems to be a customization that have been done here (that's why you get this problem): The template 'single add to cart' has been moved up to the 'short description'.
Normally you should have a select dropdown field instead of the button "Choose an option".
So you should try this:
.single-product div.product .variations_button.woocommerce-variation-add-to-cart {
padding-top: 1em !important;
}
Or even more with: padding-top: 2em !important;
Or you can try to add some "top margin" too: margin-top: 1em !important;
But not sure it will solve your problem as the only efficient way should be to have a live link.
Closed. This question needs details or clarity. It is not currently accepting answers.
Want to improve this question? Add details and clarify the problem by editing this post.
Closed 7 years ago.
Improve this question
my menu bar at the bottom of my page is triggered by an hover effect of a logo, which also has an 1sec delay on mouseout.
I want to see the menu when i enter a page for 1sec. So the user can see how you can open the menu.
Cheers Jasper
You could instead of doing it by using :hover in your css (I will assume that that is how you are doing it...) using JavaScript to add and remove a class on hover:
$(document).ready(function(){
// event hover add / remove open class
$("#menu").on("mouseenter", function(e){
$(e.currentTaget).addClass('open');
}).on("mouseleave", function(){
$(e.currentTaget).removeClass('open');
});
// hide menu 5s after page load
setTimeout(function(){
$(e.currentTaget).removeClass('open');
}, 5000);
});
When the page load your menu will have the class open by default.
<div id="#menu" class="open">
<!-- menu items... -->
</div>
Then in your css use:
#menu {
/* menu close style */
}
#menu .open {
/* menu open style */
}
Hope it helps :)
Closed. This question needs details or clarity. It is not currently accepting answers.
Want to improve this question? Add details and clarify the problem by editing this post.
Closed 8 years ago.
Improve this question
Im currently working on having a button to upload a file, but i dont want to use the default input[type=file]
here's my snippet:
%button.btn
Upload your own
%input{ :type => "file", :class => 'file-input' }
and here's the css:
left: -34; // to align it with the button
top: -23;
position: relative;
opacity: 0;
currently it works, im just not sure about the markup. twitter has the same structure also when trying to upload a profile photo.
Set the opacity of the input file button to 0 and position it over the styled button div.
Why don't you just use:
<button type='file'>Content</button>
It works the same.
Try this
Select a file: <input type="file" name="img">
more details Here