Please login or register.

Login with username, password and session length
Advanced search  
Pages: 1 [2]

Author Topic: Css and images  (Read 10323 times)

ad_267

  • Jr. Member
  • **
  • Karma: 7
  • Posts: 57
Re: Css and images
« Reply #15 on: November 20, 2007, 05:58:01 AM »

Ok the toggle div function in the admin needs to be modified too.

Change this:
Code: [Select]
function toggle(div) {
    var elem = document.getElementById(div);
    if (elem.style.display=='') {elem.style.display='none'; return;}
    elem.style.display='';
    }

To this:
Code: [Select]
function toggle(div) {
    var elem = document.getElementById(div);
    if (elem.style.display=='') {elem.style.display='none'; adjustHeight(); return;}
    elem.style.display=''; adjustHeight();
    }

All that does is calls the function that adjusts the height of the mid div every time that a div visibility is toggled.
Logged

Elessar

  • Newbie
  • *
  • Karma: 1
  • Posts: 43
Re: Css and images
« Reply #16 on: November 20, 2007, 06:37:33 PM »

 :( It's not working.
Logged
I'm a french guy, so if I made some mistakes in my post, just tell me. ;)

ad_267

  • Jr. Member
  • **
  • Karma: 7
  • Posts: 57
Re: Css and images
« Reply #17 on: November 21, 2007, 06:05:33 AM »

Hmm it works for me. If you're using SnewsMU I think there's two toggle div functions, so you'll need to modify both of them.

I see one that looks like this:
Code: [Select]
// toggle dynamic divs
function toggle(div) {
    var elem = document.getElementById(div);
    if (elem.style.display=='') {elem.style.display='none'; return;}
    elem.style.display='';
    }
Which needs to be changed to this:
Code: [Select]
// toggle dynamic divs
function toggle(div) {
    var elem = document.getElementById(div);
    if (elem.style.display=='') {elem.style.display='none'; adjustHeight(); return;}
    elem.style.display=''; adjustHeight();
    }

And then this:
Code: [Select]
function js2() { ?>
<script type="text/javascript">
// toggle dynamic divs
function toggle(div) {
if (document.getElementById(div).style.display=='') {
document.getElementById(div).style.display = 'none';
return
} document.getElementById(div).style.display = '';
}
</script>
<?php 
Which needs to be changed to:
Code: [Select]
function js2() { ?>
<script type="text/javascript">
// toggle dynamic divs
function toggle(div) {
if (document.getElementById(div).style.display=='') {
document.getElementById(div).style.display = 'none'; adjustHeight();
return
} document.getElementById(div).style.display = ''; adjustHeight();
}
</script>
<?php 
Logged

Elessar

  • Newbie
  • *
  • Karma: 1
  • Posts: 43
Re: Css and images
« Reply #18 on: November 21, 2007, 05:46:23 PM »

You win a Karma it works well, thanks al lot.  :-* :-* :-*  ;D
Logged
I'm a french guy, so if I made some mistakes in my post, just tell me. ;)

ad_267

  • Jr. Member
  • **
  • Karma: 7
  • Posts: 57
Re: Css and images
« Reply #19 on: November 23, 2007, 09:15:35 PM »

Thanks. Good luck with getting your site up and running  :)
Logged

Aysseline

  • Jr. Member
  • **
  • Karma: 4
  • Posts: 66
Re: Css and images
« Reply #20 on: November 26, 2007, 02:43:23 PM »

I don't know if you have reolved your problem but with my 3 browsers I get 3 different rendering. Break in Opera8.53 'the bottom part, break in IE6 because it had a large space on the top (push the design on bottom) and it's not transparent and when I click on comment don't know the function you have used but it crash IE ;D, better in FF.
Why you don't put it on another wrap as background with only one image ?
Logged
sNews 1.6_patched - localhost, Xampp 1.6.2 - XPSP2

Elessar

  • Newbie
  • *
  • Karma: 1
  • Posts: 43
Re: Css and images
« Reply #21 on: November 26, 2007, 05:39:50 PM »

It's not transparent because it's png files not gif, for the moment.
For IE don't how to do, I don't have it nor opera.
For an other wrap I'll do it if I find something I like  ;D

If you have ideas
the wrap is a Maori picture, and I need to find an other Maori picture
Logged
I'm a french guy, so if I made some mistakes in my post, just tell me. ;)

Aysseline

  • Jr. Member
  • **
  • Karma: 4
  • Posts: 66
Re: Css and images
« Reply #22 on: November 27, 2007, 12:50:56 PM »

Hi,
to see what others... see  ;D
Opera shot: aysseline.com/shots/snews_maoriOP.png
Firefox shot: aysseline.com/shots/snews_maoriFF.png

For IE try this good link: http://ipinfo.info/netrenderer/ I discoverer on Sasha's site: http://www.h2odot.com/
There are many other browsers view on the net, Google search

I think you're on Linux (generator Bluefish  ;)) if you use FF browser install this http://chrispederick.com/work/web-developer/ to correct your css and other developement nightmares.

For your css design, first your document can not be checked: http://validator.w3.org/check?verbose=1&uri=http%3A%2F%2Fponeyclubdebazas.com%2Fpo%2F
You use utf-15 for encoding, don't know this doctype maybe for special caracters ?

I take some time to correct errors in your css, and visu for IE6. I make you a new package. Inside you'll find a separate stylesheet for IE6. I use conditional comment see the head of the document (http://www.google.fr/search?hl=fr&q=Conditional+Comments&btnG=Recherche+Google&meta=)
with this I correct png transparency for image (but not css backgrounds) I use another way to do this, check the package. I also put comment in po file because there is some errors you need to correct maybe with sNews code or in your file.
Your new package:
Zip format: aysseline.com/shots/maori.zip
Rar format: aysseline.com/shots/maori.rar

For your css errors, here some tricks you need to learn:
- use shortland css when you can: http://www.dustindiaz.com/css-shorthand/
- don't put "px" when your value is 0 (like 0px) 0 is zero
- if you got 4 same values write only one: 4px 4px 4px 4px= 4px
- is better to code a new design with an empty css: you use minimal template but all the code is mixed with no right order but with cascading style sheet the order of declaration impact on your rendering (don't know if you understand what I mean)
- for links url write: background: url(img/image.png) not this: url("img/image.png") with no quotes
- re-read your code: you get 2 comma in your div #logo ul.nav (here: margin: 150px 0px 0px -338px;;)

Quote
For an other wrap I'll do it if I find something I like
I don't want to said that you put another design but another wrap to enclose your right image differently and don't get this badly space beetween your 3 div.

Quote
If you have ideas
maybe I can if I take time but with your colors it's not really good. I don't know if you're Maori or interest in but for me colors need to be black (for tatouages and other stuff) and green and brown or like on their flag (http://images.google.fr/images?hl=fr&q=Maori+flag&btnG=Recherche+d%27images&gbv=2).
I'm on Laptop and with my screen your colors are sad. I don't know if Bordeaux wine, blue is good but all your mix is too much for me  ;D

That's all ! :)
Logged
sNews 1.6_patched - localhost, Xampp 1.6.2 - XPSP2

Elessar

  • Newbie
  • *
  • Karma: 1
  • Posts: 43
Re: Css and images
« Reply #23 on: November 27, 2007, 09:22:06 PM »

Quote
Hi,
to see what others... see  ;D
Opera shot: aysseline.com/shots/snews_maoriOP.png
Firefox shot: aysseline.com/shots/snews_maoriFF.png

Thanks for that.

Quote
For IE try this good link: http://ipinfo.info/netrenderer/ I discoverer on Sasha's site: http://www.h2odot.com/
There are many other browsers view on the net, Google search

Thanks, I didn't know that one (I know this one : browsershots.org)

Quote
I think you're on Linux (generator Bluefish  ;)) if you use FF browser install this http://chrispederick.com/work/web-developer/ to correct your css and other developement nightmares.

For your css design, first your document can not be checked: http://validator.w3.org/check?verbose=1&uri=http%3A%2F%2Fponeyclubdebazas.com%2Fpo%2F
You use utf-15 for encoding, don't know this doctype maybe for special caracters ?

Yes I'm on linux, and playing with bluefish & FF  ;D (easy to know because of the meta link in the head tag). I already have web-developer tool, I'm using it, great thing.
the utf-15 is for special caracters as french accent, german accent etc...
I didn't try to check for the moment so I didn't know if it was working or not.


Quote
I take some time to correct errors in your css, and visu for IE6. I make you a new package. Inside you'll find a separate stylesheet for IE6. I use conditional comment see the head of the document (http://www.google.fr/search?hl=fr&q=Conditional+Comments&btnG=Recherche+Google&meta=)
with this I correct png transparency for image (but not css backgrounds) I use another way to do this, check the package. I also put comment in po file because there is some errors you need to correct maybe with sNews code or in your file.

Thanks to correct it, actually I didn't take the time to correct it for now. Coz it's not finish, but thanks.

Quote
For your css errors, here some tricks you need to learn:
- use shortland css when you can: http://www.dustindiaz.com/css-shorthand/
- don't put "px" when your value is 0 (like 0px) 0 is zero
- if you got 4 same values write only one: 4px 4px 4px 4px= 4px
- is better to code a new design with an empty css: you use minimal template but all the code is mixed with no right order but with cascading style sheet the order of declaration impact on your rendering (don't know if you understand what I mean)
- for links url write: background: url(img/image.png) not this: url("img/image.png") with no quotes
- re-read your code: you get 2 comma in your div #logo ul.nav (here: margin: 150px 0px 0px -338px;;)

Usually I'm coding with CSS 2.1 or 3 but I didn't not finish the website yet. But thanks anyway.

Quote
Quote
For an other wrap I'll do it if I find something I like
I don't want to said that you put another design but another wrap to enclose your right image differently and don't get this badly space between your 3 div.

Ok don't worry.

Quote
Quote
If you have ideas
maybe I can if I take time but with your colors it's not really good. I don't know if you're Maori or interest in but for me colors need to be black (for tattoos and other stuff) and green and brown or like on their flag

It was just temporary. Those colors Dark-red, and that blue, that green or also color for new-zealander websites I've found them on the internet, but I will try different ways.

Quote
(http://images.google.fr/images?hl=fr&q=Maori+flag&btnG=Recherche+d%27images&gbv=2).
I'm on Laptop and with my screen your colors are sad. I don't know if Bordeaux wine, blue is good but all your mix is too much for me  ;D

I've try on my laptop and it's not good either because of my screen it's a bad screen, it's a dark screen.
But on another screen it looks good.

Quote
Quote
That's all ! :)

That's good. Now I'll try as soon as I'll have enough time to modify the design and try to correct the Css code.
It didn't do it yet because it wasn't finish.

By the way I had an 404error on the "ressources" link on your website.

Edit : I had a look in your po.html, and I read your comments, some are strange it's true, but it is not the default index file you get, it was the current index with the article post and everything. you can download my default index here
And the Css for IE it is only for IE 7 ?
« Last Edit: November 27, 2007, 10:52:41 PM by Elessar »
Logged
I'm a french guy, so if I made some mistakes in my post, just tell me. ;)

Aysseline

  • Jr. Member
  • **
  • Karma: 4
  • Posts: 66
Re: Css and images
« Reply #24 on: November 28, 2007, 06:12:51 PM »

Code: [Select]
And the Css for IE it is only for IE 7Nop IE7 but IE6 and lower version.If you read your head doc I put this after the basic style sheet:
Code: [Select]
<!--[if lt IE 7]>
<link rel="stylesheet" type="text/css" href="css/ie-only.css" media="screen" />
<![endif]-->

"<!--[if lt IE 7]>" means "lower than".You can use other paramètres "lte" "lower than and equal" don't remenber all, see on Google http://www.google.fr/search?hl=fr&q=conditional+comment+to+import+specific+styles&btnG=Recherche+Google&meta=.

IE7 accept now transparent 24png as you can see on IE renderer and seems to also corrected problems of margin/padding. The only problem is the same than in Opera: the space beetween the mid div and the bottom div. As this is controlled by your js (if I well understand) that mean IE7 understand this differently than IE6.

I see your index.php
My po file is the source of your link site:
Code: [Select]
<div id="right">
<ul id="this_category"></ul><!-- ??? ul seul sans li:pas bon !!-->
<h3>W&#257;hanga / Categories:</h3>
is made by this
Code: [Select]
<div id="right">
<?php if (m('a_pag_menu')=='on'menu_articles_incat(); ?>
<h3>W&#257;hanga / Categories:</h3>
Don't know witch MOD it is (http://snewscms.com/forum/index.php?topic=5601.0 maybe) but actually it's empty and display only <ul> balises with no <li> in it.
Maybe you need to see in sNews how it's constructed and add the working code

Code: [Select]
<h3>&#274;tahi atu w&#257;hanga / Other Categories:</h3>
<ul></ul><!-- ??? ul seul sans li:pas bon !!-->
is for this part:
Code: [Select]
<?php if (m('multiple_areas')=='on') {
echo 
'<h3>&#38;#274;tahi atu w&#38;#257;hanga / Other Categories:</h3>';
echo 
'<ul>';
categories(1,'false'); 
echo 
'</ul>';} ?>

with xhtml valid <ul> can't be empty. With your code, the correct will be:
Code: [Select]
echo '<ul><li>';
categories(1,'false');
echo '</li></ul>';} ?>

But I surely wrong. Actually you have no "other categories". If you get some I supose your function displays the right code as this
Code: [Select]
<h3>&#274;tahi atu w&#257;hanga / Other Categories:</h3>
<ul>
<li>other categories 1</li>
<li>other categories 2</li>
</ul>

and if you add the <li> in echo the code become wrong
Code: [Select]
<h3>&#274;tahi atu w&#257;hanga / Other Categories:</h3>
<ul><li>
<li>other categories 1</li>
<li>other categories 2</li>
</li></ul>

See how the empty statement is writed in this functions in sNews

But for all this you need a valid doctype and you need to be concerned by web standard. If you don't care let it as this  ;)

Quote
By the way I had an 404error on the "ressources" link on your website.
;D you have "jeter un oeil" (to throw an eye ?) on my site ! If you see on homepage I stopped my update on october 2006, no time! (I need to remove "new version lauched" because very old now !)
If why I want to port it on sNews. When I'll be ready "ressources" section will be ok ;)
Logged
sNews 1.6_patched - localhost, Xampp 1.6.2 - XPSP2

Elessar

  • Newbie
  • *
  • Karma: 1
  • Posts: 43
Re: Css and images
« Reply #25 on: November 28, 2007, 06:34:33 PM »

Ok for your website, I dind't read it. no time, just try to visit the different pages.
Ok for IE.
I care of the web standards.
For the <li> I'll try to fix that. (when i'll have time)
 ;)

Thanks for all.

;D you have "jeter un oeil" (to throw an eye ?)

Have a look.

Logged
I'm a french guy, so if I made some mistakes in my post, just tell me. ;)
Pages: 1 [2]