I have a simple page with products-list (downside) and basket (upside). When i click on any product in products-list, it will move img from product's list td to basket's td. It is realized by tables with some width, height and paddings of td's. But in IE7 there is an issue with padding-top when td is empty. Please, look at this image and tell me, why td in products-list (the grey ones) are not affected from padding-top?
Image:
In IE, if a td tag is empty, it consider it does not exists. Add a (HTML entity for space) in each td who have no content to avoid this bug.
Alternatively, you might be able to use border-top rather than padding-top to fix this issue.
Related
Im trying to add a ripple effect to a card using angular material. The ripple effect works the way it supposed except that it expands the hight of the card when the effect is active.
How can I stop the card from expanding?
<mat-card mat-ripple>
<mat-card-content>This is content</mat-card-content>
</mat-card>
Stackblitz that demonstrates the behaviour
Add a class (i.e. last-child) to the last child of your mat-card (in your case mat-card-content) and define the following style:
.mat-card .last-child {
margin-bottom: 0;
}
The problem is that matRipple adds an zero-height element to the mat-card while Angular Material only removes the margin-bottom from the last child.
If you add the footer element (with or without content) you won't need additional CSS and this will lock the height when activating the ripple effect.
<mat-card mat-ripple>
<mat-card-content>This is content</mat-card-content>
<mat-card-footer></mat-card-footer>
</mat-card>
should be as easy as adding matRipple to the mat-card
<mat-card class="action-card" matRipple>
<mat-card-title>
{{content}}
</mat-card-title>
<mat-card-content>
desc
</mat-card-content>
</mat-card>
make sure you inject the MatRippleModule into your module.ts though, that threw me off for a while
Use a div -Tag inside of mat-card -Tag. This Fix my issue.
I have a big problem with arranging the text from "featured products" in prestashop. First of all, I want the title to be on two lines and centered. I've tried several methods, but with no success. Second, I want "short description" to have more characters and be centered as well.
I've posted below the link to the site and an image of how I would like it to look. Do you know what line should I change or what I need to do?
http://www.3bwine.com/CRISTY/prestashop/index.php
http://oi58.tinypic.com/1608m10.jpg
This is a simple CSS "problem". Css for described changes come from two files.
.../prestashop/themes/default/css/golbal.css
.../prestashop/modules/homefeatured/homefeatured.css - this is not very important but may or may not interfear with some of our changes
To align your title they way you showed on your image I reccomend to add these lines of code to your global.css file ( as you dont have any VERY unique classes on your p or a elements we will be targeting them from a bit further)
div#featured-products_block_center div.block_content ul li p.s_title_block a{
text-align:right;
width: 150px; // set as big/small as you want yoru heading title to display, you can play around with it. This should push the title on two lines, but if your title is chagining all the time in lenght then it might not be useful.
font-size: 22px; // should overwrite the current font-size, make as big/small as you need
}
To align description the way you need add this line to global.css file
div#featured-products_block_center div.block_content ul li div.product_desc a{
text-align:right;
margin-bottom: 20px; // you can play around with it , this pushes your price further away from the text
}
To change the lenght of your short description go to ../prestashop/modules/homefeatured/homefeatured.tpl and locate something similar to this
{$product.description_short|strip_tags|truncate:65:'...'}
And there change the truncate to whatever you need. ( changes the lenght of your " short description"). Number is in characters.
BR's
I translated DataTables links to brazilian portuguese and now I'm having a problem with links' width as some of the used words are longer than the original english word. How can I resize these links?
Thanks
How did you translate it ?
I tried to translate it and it works well.
The text is inside a span which class is paginate_button so no problem with the content width, btw you can style it using css.
Just an example:
.dataTables_paginate span.first,
.dataTables_paginate span.last {
background-color: red;
}
I am new to div stylesheet and i only discovered how to use :
margin-top/left/right/bottom.
What is the position used for ?
What is left/right/top/bottom attrib used for?
What is display used for?
Is there any other attrib which i need to take note of/usage for positioning my div ?
Regards
http://www.w3schools.com/css/pr_class_position.asp
http://www.w3schools.com/css/pr_pos_left.asp
http://www.w3schools.com/css/pr_class_display.asp
http://www.w3schools.com/css/css_positioning.asp
margin is in relation to the closest container while left/right... is in relation to the entire page.
Display determines if the object is visible/hidden or how the element behaves. Like display: inline means the elements will display on the same horizontal plane if possible.
I am using struts 2.1.6 with ONGL. Please see the code below and tell me where should I define properties to <td> tag like width, height, bgcolor etc. in line no 3 and 4.
1) s:form action="Login">
2) <table>
3) <tr><s:textfield key="username"/></tr>
4) <tr><s:password key="password" /></tr>
5) </table>
6) </s:form>
<s:textfield> only creates a text field (input tag) and doesn't do td tags. You can insert them yourself (actually, you probably should, I don't think tr tags with straight content are legal?). In most cases it's considered better form to use CSS for styling and not resort to tables for layout, but that's another matter.
Edit: sorry I didn't think all this through. Basically, those tags are inserted by the struts theme. You can either set such things you want to set with CSS, or use the simple theme, this question in the docs should get you started.