By narcisgirona on

been working with my site for ages and now that i almost finnish i though lets have a look how it looks with a windows computer, and it sucks! amazing it looks like shait! sorry for the vocabulary.. why is showing different the web depending on the browser? how ridiculous is that? i mean can't understand the point..

Any help would be much apreciated

thanks

⋅ Categories: Drupal 7.x

Comments

nevets’s picture

nevets commented

Without a link to the site there is no way to tell. A common problem is badly formed html, you might try validating your page to make sure there are no missing or mismatched tags.

robertcfi’s picture

robertcfi commented

There are tons of different internet browsers and internet versions. The version of Safari for MAC will render differently than the safari for Windows. Its just how it is. The gaps are close and browsers are getting better but for now; cross-testing your browsers is very important.

Most drupal themes come with a "IE", "IE7", "Safari", "Chrome" stylesheet.

You can make changes to just the IE style sheet so that only the IE browser is affected. One of the hardest parts of creating a website is making sure it looks good in ALL browsers and btw; it sounds like you are on a MAC but most the world isn't so most the world is going to see the way it looks on the PC.

If you give us the URL we can help. I would also check it on W3C validation to see if you have any HTML messing it up.

narcisgirona’s picture

narcisgirona commented

www.secondstoregirona.com/user

user: drupal
pass: drupal

then:

http://www.secondstoregirona.com/node/add/publicar-anuncis-compravenda

the file box is smaller depending on the browser as well the main menu on the left the font is different too.

Could i setup one style.css for each browser? and configure each one?

thanks guy for helping

brokenrob43’s picture

brokenrob43 commented

My advice:

1) Run your website through WC3 validation. (you won't believe how much of an education this will be for you).
2) Then check your site on different versions of IE (specifically v7, v8 and v9). Different CSS will render differently in each of these.
3) Try to rewrite your CSS, focusing on one problem at a time, till you get it "close enough" for IE, without making too much of an impact on Chrome/FF/SAF/etc...
4) Don't go crazy.

IE is a total pain in the arse, there's just no getting around it. I almost always include some kind of IE-detecting popup on my sites (that users can turn off) that alerts people to how crappy the internets look on IE and that there are far better (and FREE) alternatives like chrome/ff.

if(isset($_SERVER['HTTP_USER_AGENT'])&&(strpos($_SERVER['HTTP_USER_AGENT'], 'MSIE') !== false)) {
    echo '<div class="IE-diediedie">Why do you insist on using the worst browser available?........</div>';
}

I mean, cmon, IE still can't handle Google Web Fonts! not to mention the simplest of CSS. It's frustrating, but don't let it take you too far off track.

Remember also that IE users are probably used to pages that are rendered like crap. IMHO, if they insist on IE, then let them have the crap rendering.

narcisgirona’s picture

narcisgirona commented

thanks man!

could you help get started?

i have checked with WC3 validation and getting some errors.. but have no idea how to get to them. (i'm not really a programmer..)

Ok here is the first error i get:
-------------------------------------------------
Line 112, Column 20: there is no attribute "class"

-------------------------------------------------

The only think i could think of right now is to check the theme style.css file and look for the group-left: (i find this)

-------------------------------------------------
.group-left {
float: left;
margin-left: 0px;
margin-top: 2px;
width: 15%;
}
-------------------------------------------------

the original css is from ds (display suite) and i copied that piece to my theme so i could modify it without modifying the module.

Now i really don't know what else to do..

Any ideas?

thanks

brokenrob43’s picture

brokenrob43 commented

Looking on FF (mac)

I see a few positioning problems right off the bat.
The input boxes are too wide, and this is probably what is throwing off IE.
Also, the random "t" to the far right of where it says "Publicar Anuncis de Compravenda".

You do need to have another gander at your css.

narcisgirona’s picture

narcisgirona commented

Actually is because there are no spaces, as soon as i put some spaces the text gets better.

hopefully not some many troll will post something like that.

thanks again brokenrob43

btw: my site depending on the browser i use looks way different. there is a way to configure a specific style.css for each browser?