X-Cart forums - Error in Light & Lucid 3-columns

X-Cart forums (https://forum.x-cart.com/index.php)

- Changing design (https://forum.x-cart.com/forumdisplay.php?f=51)

- - Error in Light & Lucid 3-columns (https://forum.x-cart.com/showthread.php?t=51522)

Re: Error in Light & Lucid 3-columns

Thank you all for your responses.

Quote:

Originally Posted by gizmo

BTW - you testing on home server as well?
And you say you cannot log in, have you imported a database? if so make sure

blow fish

key is same as the database you imported..

Well, I managed to import the database and make the cart work in a local installation, but the problem is I can't login to the admin part of my site. When I give my username and password I get a message saying that I can't login because my browser does not accept cookies. I tried with firefox, ie and chrome but every time I get the same message.

Quote:

Originally Posted by gb2world

You can center the div with the stars in it by giving it a width and using margin auto, something like this:

Code:

.creviews-rating-box {

width:100px;

margin:5px auto;

}

Nice! That centered the stars but now I have another problem.

If i click on a star to vote for a product the alignment returns to the left. To see what I mean, go to my test site and rate a product.

Best regards,
Andreas

Re: Error in Light & Lucid 3-columns

Quote:

If i click on a star to vote for a product the alignment returns to the left. To see what I mean, go to my test site and rate a product.

It appears the module is adding in-line css, probably with javascript, after you rate something that is over writing your width setting to be style="width: auto;" It will not center with this in-line code.

At this point - you are going to have to experiment to see if the writers of this code have a reason for adding this in-line style for rated products. You can use webmaster mode to find the template where they are doing this. You can take it out and see the impact. You can also use Firefox/Firebug to see the css that is controlling all this and experiment using these tools. You can also try creating your own div with width and margin set to center it, and place it around the cre-views-rating-box div. This is essentially what Ashley suggested above - only use a div with width, not a td.

Re: Error in Light & Lucid 3-columns

Happy new year everybody!

Quote:

Originally Posted by gb2world

First of all accept my apologies for not answering for so many days.

After a lot of trial and error I finally found the solution. All I need now is to see if all pages appear correctly. And this has to be done in all browsers.

I 'd like you to check it and see if there is any change that may affect other things.

So here is the way to do it:

I opened the skin1/main.css version:

Code:

/*

$Id: main.css,v 1.269.2.3 2009/11/10 15:58:44 joy Exp $

vim: set ts=2 sw=2 sts=2 et:

*/

and made the following changes:

1. Replaced this

Code:

.products .price-row {

  margin: 0px;

  padding: 0px;

  text-align: left;

}

with this

Code:

.products .price-row {

  margin: 0px;

  padding: 0px;

  text-align: center;

}

2. Replaced this

Code:

.products .buy-now .quantity {

  height: 30px;

  white-space: nowrap;

  vertical-align: middle;

}

with this

Code:

.products .buy-now .quantity {

  height: 30px;

  white-space: nowrap;

  vertical-align: middle; 

  text-align: center;

}

3. Replaced this

Code:

.products-table td.product-cell-buynow .button-row {

  text-align: left;

  margin: 9px 0 5px;

}

with this

Code:

.products-table td.product-cell-buynow .button-row {

  text-align: center;

  margin: 9px 0 5px;

}

4. Replaced this

Code:

.products-table .image {

  padding: 0px;

  margin: 5px 0px;

  text-align: left;

}

with this

Code:

.products-table .image {

  padding: 0px;

  margin: 5px 0px;

  text-align: center;

}

5. Replaced this

Code:

.products-table .sku {

  margin-top: 5px;

}

with this

Code:

.products-table .sku {

  margin-top: 5px;

  text-align: center;

}

6. Replaced this

Code:

.creviews-rating-box {

  margin-top: 5px;

  padding-bottom: 7px;

}

with this

Code:

.creviews-rating-box {

  margin: 0px auto;

  padding-bottom: 7px;

  width: 100px;

  text-align: left;

}

You may wonder why I added this "text-align: left". Well, If this doesn't exist for some reason the rating box appears out of place in Internet Explorer. I don't know why but this fixed it. And since it doesn't mess anything else I left it.

7. Replaced this

Code:

.creviews-vote-bar ul {

  list-style: none;

  margin: 0px;

  padding: 0px;

  overflow: visible;

}

with this

Code:

.creviews-vote-bar ul {

list-style-image: none;

list-style-position: outside;

list-style-type: none;

margin: 0 auto;

overflow: visible;

padding: 0;

width: 100px;

}

8. Replaced this

Code:

.creviews-rating {

  font-size: 10px;

  color: #8a8a8a;

}

with this

Code:

.creviews-rating {

  font-size: 10px;

  color: #8a8a8a;

  text-align: center;

}

9. Replaced this

Code:

div.market-price {

  margin-top: 4px;

}

with this

Code:

div.market-price {

  margin-top: 4px;

  text-align: center;

}

10. Replaced this

Code:

.products-table .product-cell {

  background: #ffffff none;

  padding: 0px;

  vertical-align: top;

}

with this

Code:

.products-table .product-cell {

  background: #ffffff none;

  padding: 0px;

  vertical-align: top;

  text-align: center;

}

There are some more changes to be made (for example, if you use taxes you may need to center align the taxes row) but I won't go in further details right now.

Thank you all for helping with one way or another!
Andreas

Re: Error in Light & Lucid 3-columns

It looks like it works ok on firefox, ie 8 and chrome.

Unfortunately, there is a mess in ie 6 and probably in ie 7.

Any ideas?

Re: Error in Light & Lucid 3-columns

The centre looks ok As Far as I can see using IE7, not tested it on IE 8 on my laptop, but check the main.IE6/7 etc css files and also check altskin.css and the ie6/7 alt skins.............

I use to have a nice piece of sotware to check in all browsers, and use to work well, I have lost it and can't remember what it's called. (Maybe google it)