Skip to main content

This site requires you to update your browser. Your browsing experience maybe affected by not having the most up to date version.

We've moved the forum!

Please use forum.silverstripe.org for any new questions (announcement).
The forum archive will stick around, but will be read only.

You can also use our Slack channel or StackOverflow to ask for help.
Check out our community overview for more options to contribute.

Themes /

Discuss SilverStripe Themes.

Moderators: martimiz, Sean, Ed, biapar, Willr, Ingo, swaiba

IE7 hack


Go to End


3 Posts   3080 Views

Avatar
andreww

Community Member, 4 Posts

15 February 2010 at 11:59pm

Edited: 23/02/2010 10:06pm

My ecommerce sidebar won't sit on the right when viewed with IE7. I've added the IE7 hacks, but it doesn't seem to make any difference. IE6 hack seems to work ok (at least it views OK in IE6)
you can view the mess here: http://mikeschainsawshop.co.nz/shop/
Any ideas what I have done wrong?

Avatar
patjnr

Community Member, 102 Posts

26 February 2010 at 8:24pm

Hi

dude try to avoid hacks at all cost unless otherwise....

try this.

modify your css to

#leftsub {
width 450px
margin-left:27px;
float:left;
position:relative;
padding 0 10px 30px 0;
}


#sidebar {
width:180px;
float:left;
position:relative;
}

these two DIVs are to be inside the content DIV

Avatar
andreww

Community Member, 4 Posts

26 February 2010 at 9:34pm

Hi Pat,
Thanks for code, I put it in the ie7 hack. It's made the side bar drop down the page a bit, but it's still on the left. I tried changing left to right, but it doesn't seem to make any difference.
The ie7 hack now looks like this:

/**
SilverStripe Black Candy Theme
http://www.silverstripe.com

IE7 Hacks Stylesheet.
*/

label {
margin-bottom: -10px;
}

/** The fonts are soo ugly. **/

/**added by Andrew**/
#leftsub {
width 425px
margin-left:27px;
float:left;
position:relative;
padding 0 10px 30px 0;
}

#sidebar {
width:180px;
float:right;
position:relative;
}
/** finish andrews addition**/

#Sidebar li li {
font-size: 0.8em;
}
#Sidebar li li li a {
font-size: 0.8em;
}
#Sidebar ul#Menu2 li a.levelb {
width: 180px;
}
#Sidebar ul#Menu2 li a.levelb:hover {
width: 180px;
}

/* SEARCH FORM
-----------------------------------------------*/
html body #SearchForm_SearchForm {
width: 240px;
margin-top: -5px;
}
html body #SearchForm_SearchForm #SearchForm_SearchForm_action_results {
float: right;
margin-top: -25px;
}

I'm a bit of a newbie to this (as you can probably tell)
Any other ideas?