Please need help about custom field css

[mulosmani]

im trying to create a custom field image for color selection but the output is incorrect. Im using vm2.06 and J2.5 . Can anyone help me please?This is the page:
http://www.istream.al/new/shop-en/iphone/iphone-4s-detail

[srajca]

try this
http://forum.virtuemart.net/index.php?topic=102850.0

[mulosmani]

Thank you for replying, but i cant find how to fix the layout. i have tried before this post with firebug but found nothing.can you do something please?

[srajca]

try to use the following code.
Put it in your template.css and replace with the classes already inside your css file, if there are any classes that aren't already in your css, paste them - this will be an override for vmsite-ltr.css

Code Select Expand

div.contentp div form div.product-fields div.product-field {
    display: inline-block;
    float: left;
    margin: 0 0 10px;
    padding: 0;
    text-align: left;
    width: 100%;
}

div.contentp div form div.product-fields div.product-field div.product-fields-title {
    margin-bottom: 5px;
    width: 100%;
}

div.contentp div form div.product-fields div.product-field div.product-field-display_desc-container {
    margin-left: -5px;
    width: 100%;
}

div.product-field-type-M div.product-field-display_desc-container span.product-field-display label img {
    border: 2px solid transparent;
    float: left;
    margin: -6px 25px;
    text-align: left;
    vertical-align: middle;
}

.vm-img-desc {
    display: block;
    float: left;
    margin: 0 -20px;
}

div.product-field-type-M div.product-field-display_desc-container span.product-field-display label {
    clear: right;
    display: inline-block;
    float: none;
    height: 18px;
    margin: -4px 0;
    top: 0;
    width: 88%;
}

div.product-field-type-M div.product-field-display_desc-container span.product-field-display label img {
    border: none;
    float: left;
    height: 17px;
    margin: 0 27px;
    text-align: left;
    vertical-align: top;
}
div.product-field-type-M div.product-field-display_desc-container span.product-field-display label img:hover {
border:none;
}
div.product-field-type-M div.product-field-display_desc-container span.product-field-display label img:after {
border:none;
}

let me know how it goes.