Forum Moderators: not2easy

Message Too Old, No Replies

Contradiction between CSS files.

         

krugi

12:25 pm on Dec 6, 2009 (gmt 0)

10+ Year Member



Hello everybody.

I'm creating a web gallery, and i found some kind of gallery and downloaded the source files.
The gallery built with jQuery and CSS.
After i wrote the code inside my webpage, the gallery was messy.
Because my website is RTL, i tried to change it to LTR, but it didn't helped.
After few tests i understood that the CSS page code for my page messing the gallery structure.
I knew that after i deleted the code that brings the CSS file into my page.

What can i do to avoid this mess?

swa66

2:02 pm on Dec 6, 2009 (gmt 0)

WebmasterWorld Senior Member 10+ Year Member



What can i do to avoid this mess?

That's a very good question, but it would require planning from both the author of that image gallery and yourself to avoid targeting elements you should not and still allow global settings where possible.

Very few CSS code that I've seen is even remotely ready for this.

The easiest path to this nirvana is to learn (a lot) about CSS selectors and specificity and how it all works.

The fastest way to make it work: understand the CSS of the gallery and modify it to allow for the rest of the site.

krugi

2:35 pm on Dec 6, 2009 (gmt 0)

10+ Year Member



Thanks you for answering, but i solved this.
I found out that there a "direction: rtl;" inside my CSS file,
So i duplicate it and at the new copy i deleted this line and applied it just for the specific page.

Now i have another question, related to the previous.
I'll describe the gallery design because it's important for this question:
There's a big square and a thumbs menu under it.
when clicking thumbnail, the full picture shows up inside the big square.
The problem is that the thumbs is not centered. it at the right area of the menu.
And i tried to place <center> inside the HTML before the thumbs but it's not working.
Well, it kind of working. it's taking it to somewhere at the left side of the menu.

Any idea how to solve it?

krugi

5:11 pm on Dec 6, 2009 (gmt 0)

10+ Year Member



Oh, actually the <center> tag is not putting the thumbs at the left area of the menu,
it's putting it in the center of the entire page- not at the center of the gallery <div>.

SuzyUK

10:32 pm on Dec 6, 2009 (gmt 0)

WebmasterWorld Senior Member 10+ Year Member



krugi, you shouldn't need the <center> "tag"

It's a bit hard to say for sure but could you post the Gallery code - don't need the images just the containers, and just use <img /> for where the images are

The thumbs menu and the main gallery display should be two "sub" divs inside a master container div for the entire setup (not really caring what's inside them sub divs yet)

It would be useful for us to see how these two "sub" divs are getting their positioning given to them already, then we should be able to help advise you how best to get it to work with your code. The main thing is to get it working in a completely blank page first (with same Doctype as your content pages) then when you incorporate into your content if it's not working then, the only reason it won't be is because of selector specificity ;)

So get it working in separate page first, this will give us all sample code to work with, after that making it specific will be very easy!