Hi everybody,
I present first my smileys website <!-- m --><a class="postlink" href="http://kennygunie.free.fr/emoticons/">http://kennygunie.free.fr/emoticons/</a><!-- m -->
My problem is: as you can realize, some smileys are not alines, can anyboby help me to correct that please?
My code
css file:
#smileys {
position: relative;
left: 50%;
width: 800px;
margin: 0 -400px;
border: 1px solid #000;
padding: 5px;
font-size: 9px;
color: #CCCCCC;
}
.smiley {
font-size: 9px;
color: #CCCCCC;
margin: 2px;
float: left;
width: auto;
text-align: center;
}
html/php file:
echo " <div id=\"smileys\">\n";
foreach ($files as $file)
{
...
echo " <div class=\"smiley\">\n";
if ($conf['show_names'])
{
echo " ".substr($name, 0, strrpos($name, '.'))."<br/>\n";
}
echo " <a href=http://www.webdeveloper.com/forum/archive/index.php/\"javascript:CopySmiley('{$conf['page_url']}smileys/$name')\"><img src=http://www.webdeveloper.com/forum/archive/index.php/\"smileys/$name\" alt=\"$name\" /></a>\n";
echo " </div>\n";
}
}
}
echo " <div style=\"clear: both; visibility: hidden;\"> </div>\n";
echo " </div>\n";
Thank youTry specifying a width and height for your smiley div (by the way, those are called EMOTICONS, are they all smiling? NO! EMOTICONS, EMOTICONS, GRRR ARGH!!!!!! "Smileys" is my most actively hated misnomer)
.emoticon {
font-size: 9px;
color: #CCCCCC;
margin: 2px;
float: left;
width: auto;
text-align: center;
width:100px;
height:100px;
}Hi WoD, thank u for answering quickly
I can't fix the emoticons (okie as u want, not smileys) width and height, because they dont have the same size. Look here <!-- m --><a class="postlink" href="http://kennygunie.free.fr/emoticons/index.php?offset=700&perpage=50">http://kennygunie.free.fr/emoticons/ind ... perpage=50</a><!-- m --> . Its too much for the small icons, but not enough for the big... That's why I don't use width, height in my css
Do u have another solution? I have a doubt: I can't do that with css, do u think so?You can get rid of your classitis by recognizing that all divs inside the #smileys div are the same class. You might also consider transforming all those divs with bare text into dl/dt/dd sets.
As far as your visibility problem goes, it looks to be an IE bug because they look fine in FF.
I present first my smileys website <!-- m --><a class="postlink" href="http://kennygunie.free.fr/emoticons/">http://kennygunie.free.fr/emoticons/</a><!-- m -->
My problem is: as you can realize, some smileys are not alines, can anyboby help me to correct that please?
My code
css file:
#smileys {
position: relative;
left: 50%;
width: 800px;
margin: 0 -400px;
border: 1px solid #000;
padding: 5px;
font-size: 9px;
color: #CCCCCC;
}
.smiley {
font-size: 9px;
color: #CCCCCC;
margin: 2px;
float: left;
width: auto;
text-align: center;
}
html/php file:
echo " <div id=\"smileys\">\n";
foreach ($files as $file)
{
...
echo " <div class=\"smiley\">\n";
if ($conf['show_names'])
{
echo " ".substr($name, 0, strrpos($name, '.'))."<br/>\n";
}
echo " <a href=http://www.webdeveloper.com/forum/archive/index.php/\"javascript:CopySmiley('{$conf['page_url']}smileys/$name')\"><img src=http://www.webdeveloper.com/forum/archive/index.php/\"smileys/$name\" alt=\"$name\" /></a>\n";
echo " </div>\n";
}
}
}
echo " <div style=\"clear: both; visibility: hidden;\"> </div>\n";
echo " </div>\n";
Thank youTry specifying a width and height for your smiley div (by the way, those are called EMOTICONS, are they all smiling? NO! EMOTICONS, EMOTICONS, GRRR ARGH!!!!!! "Smileys" is my most actively hated misnomer)
.emoticon {
font-size: 9px;
color: #CCCCCC;
margin: 2px;
float: left;
width: auto;
text-align: center;
width:100px;
height:100px;
}Hi WoD, thank u for answering quickly
I can't fix the emoticons (okie as u want, not smileys) width and height, because they dont have the same size. Look here <!-- m --><a class="postlink" href="http://kennygunie.free.fr/emoticons/index.php?offset=700&perpage=50">http://kennygunie.free.fr/emoticons/ind ... perpage=50</a><!-- m --> . Its too much for the small icons, but not enough for the big... That's why I don't use width, height in my css
Do u have another solution? I have a doubt: I can't do that with css, do u think so?You can get rid of your classitis by recognizing that all divs inside the #smileys div are the same class. You might also consider transforming all those divs with bare text into dl/dt/dd sets.
As far as your visibility problem goes, it looks to be an IE bug because they look fine in FF.