Posting in the Magento forums has been disabled pending the implementation of a new and improved forum solution which should better serve the community.

For new questions please post at magento.stackexchange.com, the community-run support site for the Magento community. We will be providing updates on the new forum solution soon. For questions or concerns please email community@magento.com.

Magento Forum

Help CSS problem with IE7
 
themobilephonesite
Jr. Member
 
Total Posts:  25
Joined:  2008-08-11
 

Hi Guys,

I am having a nightmare with css powered buttons please can someone help me. I read the wiki started creating css buttons for my site, which work fine in firefox, but not in IE7.

here is the phtml code used

<div class="box">

<
class="img-btn btn-menu" href="<http://www.themobilephonesite.com/bluetooth/hands-free>"/><img scr="btn_handsfree.jpg" style="width:195;height:24"/><span><?php echo Mage::helper('checkout')->__('steves side buttons');?></span></a>
<
class="img-btn btn-menu" href="<http://www.themobilephonesite.com/bluetooth/hands-free>"/><span><?php echo Mage::helper('checkout')->__('steves side buttons');?></span></a>

<
br><br><br> <br><br>
    
<?php if (strtolower(substr($this->getLinkUrl(),0,4))==='http'): ?>
        
<a href="<?php echo $this->getLinkUrl() ?>">
    
<?php elseif($this->getLinkUrl()): ?>
        
<a href="<?php echo $this->getUrl($this->getLinkUrl()) ?>">
    
<?php endif ?>
    
<img src="<?php echo $this->getSkinUrl($this->getImgSrc()) ?>" width="195" alt="<?php echo $this->__($this->getImgAlt()) ?>" style="display:block;" />
    
<?php if ($this->getLinkUrl()): ?>
    
</a>
    
<?php endif ?>

and the css code used

.img-btn {
          display
:block;
          
float:left;
          
background:transparent url(../images/media/btn_handsfree.jpgno-repeat 1000;
          
width:185px;
          
height:24px;
          
font:12px arialhelveticasans-serif
          
font-weight:bold;
          
color:#bcd6e3;
          
padding-right:10px;
          
margin-top:5px;
          
}
      
.btn-menu, .btn-menu:hover {
          color
:#fef5e5;
          
text-decoration:none;
          
}
     
      
.btn-menu span {
          display
:block;
          
padding:0px 17px 0px 10px;
          
background:transparent url(../images/media/btn_handsfree.jpgno-repeat;
          
line-height:25px;
          
}

I can not understand why this is not working in IE7. I have attached images for further illustration.

thank you

Image Attachments
Firefox.jpgIE7.jpg
 
Magento Community Magento Community
Magento Community
Magento Community
 
leopold_gn
Jr. Member
 
Total Posts:  9
Joined:  2008-12-03
 

hi,there
you can put your code in ie7minus.css which under your css file and have a try.

 
Magento Community Magento Community
Magento Community
Magento Community
 
Reino
Sr. Member
 
Avatar
Total Posts:  78
Joined:  2008-06-22
Utrecht, The Netherlands
 

Or post a URL where the webshop is running?

 
Magento Community Magento Community
Magento Community
Magento Community
Magento Community
Magento Community
Back to top