Simple Notepad – editing CSS for IE 7

You might want to try reducing the width of your sidebar using conditional IE7 (or below) CSS.

https://quirm.net/2009/06/29/wordpress-conditional-comment-css/

thanx.

I added to home.php (template for main paige of blog) that:

<!--[if IE]>
<link rel="stylesheet" href="<?php bloginfo('template_directory'); ?>/ie.css" media="screen" type="text/css" />
<![endif]-->

i uploaded ie.css to theme’s folder and it contains only that:

.wrap {width:960px; margin:20px auto; border:1px solid black; background: transparent	url("images/paper.jpg");}
.content {width:680px; float:right; padding:0px 20px 0px 20px; min-height:600px;}
.sidebar {width:200px; float:left; padding:0px 10px 40px 10px;}

so, as we see – https://x-files.net.ua/ – column with content is upper and where it should be, but sidebar got smaller.
i didn;t change the width of sidebar in ie.css.

that is the correct sidebar – https://x-files.net.ua/?p=1

help please to make needed changes…

p.s. main style.css is:

/*
Theme Name:		Simple Notepad
Theme URI: 		https://thestateofflux.com/simple-notepad-theme
Version: 		1.0.1
Description: 	A clean design reminiscient of a notepad on a desk.  This theme is suitable for multiple authors and features an about page for each one.  Uses gravatars, widgets, SEO.
Author: 		Damien Flux
Author URI:		https://thestateofflux.com
Tags:			two-columns, fixed-width

Licensed under the terms of the GNU General Public License version 2.
*/

/********** MAIN **********/
body {font: 13px/1.5 Verdana, Arial, Helvetica, sans-serif; background: transparent url("images/leather.jpg");}
input {font: 13px/1.5 Verdana, Arial, Helvetica, sans-serif; background: transparent;}
textarea {font: 13px/1.5 Verdana, Arial, Helvetica, sans-serif; background: transparent;}
.wrap {width:960px; margin:20px auto; border:1px solid black; background: transparent	url("images/paper.jpg");}
.content {width:700px; float:right; padding:0px 20px 0px 20px; min-height:600px;}
.sidebar {width:200px; float:left; padding:0px 10px 40px 10px;}
.screen-reader-text {display:none;}
.post-meta {list-style-type: none; color: #4F3636; margin: 0; padding: 0;}
.post-meta, .post-meta li {display: inline;}
.post-meta-key {list-style-type: none; display: none;}

/********** HEADER **********/
.header {padding:10px 10px 40px 10px; margin-bottom:30px;}
.header h1, h1 a, h1 a:hover {font-size:40px; color:#000000; font-weight:bold; line-height:48px; text-decoration:none; font-family: "Courier New", Courier, monospace;}
.header h4 {color:#333333; font-style:italic; font-size:14px; padding-left: 50px; font-family: "Courier New", Courier, monospace;}

/********** FOOTER **********/
.footer {font-size:10px; text-align:center; line-height:16px; color:#858585; padding-bottom:20px;}
.footer li {list-style-type: none;}
.footer a {color: #858585; text-decoration:underline;}

/********* SIDEBAR **********/
.sidebar ul {list-style-type: none; padding: 0px 0px 0px 10px;}
.sidebar li {list-style-type:none;}
.sidebar ul li {background:transparent url("images/sidenavup.png") 0px 7px no-repeat; margin:0px 0px 0px 0px; padding:0px 0px 0px 18px;}
.sidebar ul li:hover {background:transparent url("images/sidenavover.png") 0px 7px no-repeat;}
.sidebar a {color:#344342; text-decoration:none;margin: 0px; padding: 0px;}
.sidebar a:hover {color:#ffffff; text-decoration:blink;margin: 0px; padding: 0px;}
.sidebar h3 {font-weight:normal; clear:both; font-size:16px; padding:20px 0px 0px 0px;}
.sidebar a img {border: none;}
.widgettitle {display: none;font-weight:normal; clear:both; font-size:10px;margin: 0px; padding: 0px;}
.widget_categories ul li {list-style-type: none; font: Bold 13px Arial; background: none; margin: 0px; padding: 0px;}
.widget_categories ul li:hover {background: none;margin: 0px; padding: 0px;}
.widget_categories ul {margin: 0px; padding: 0px;}
.sidebar #searchform #s {width: 130px;}
.sidebar #searchform #searchsubmit {width:55px;height:22px;}

/******************** SEARCH ********************/

.searchdiv {margin: 30px 0px 0px 0px;padding: 0px;width: 130px;}
.searchform {margin: 0px;padding: 0px;overflow: hidden;width: 130px;}
.s {color: #323232; font-size: 11px; padding: 4px; width: 130px; margin: 4px 0px 0px 0px; border: 1px solid #323232; background: transparent url("images/paper.jpg");}
.sbutt {background: #878787;color: #FFFFFF;font-size: 11px;width: 130px;font-family: Verdana, Helvetica, Sans-Serif;padding: 1px;margin: 0px 0px 0px 5px;border: 1px solid #333333;cursor:pointer;}

/********** CONTENT **********/
.content h1 {display:none;}
.content h2, h2 a {color:#000000; font-weight:normal; clear:both; font-size:20px; padding:20px 0px 0px 0px; text-decoration:none;}
.content h2 a:hover {color:#120B7F; text-decoration:none;}
.content h3 {font-weight:normal; clear:both; font-size:16px; line-height:20px; padding:20px 0px 5px 0px;}
.content h4 {font-weight:normal; clear:both; font-size:14px; line-height:18px; padding:15px 0px 5px 0px;}
.content h5 {font-weight:normal; clear:both; font-size:12px; line-height:18px; padding:10px 0px 5px 0px;}
.content h6 {font-weight:normal; clear:both; font-size:10px; line-height:16px;}
.entry-header {font-size:20px;}
.entry-header a {color:#56A5DF; text-decoration:none;}
.entry-header a:hover {color:#120B7F; text-decoration:none;}
.entry-content {overflow:hidden;}
.entry-content a {color:#56A5DF; text-decoration:none;}
.entry-content a:hover {color:#120B7F; text-decoration:none;}
.entry-footer {font-size:10px; padding-bottom:20px;}
.entry-content ul {list-style-type:none;}
.entry-content ol li {background:none; margin: 0px 0px 0px 0px; padding:0px 0px 0px 5px;}
.entry-content li {background:transparent url("images/arrow.png") 0px 5px no-repeat; margin: 0px 0px 0px 0px; padding:0px 0px 0px 15px;}
.entry-content ul li {background:transparent url("images/arrow.png") 0px 5px no-repeat; margin: 0px 0px 0px 0px; padding:0px 0px 0px 15px;}
blockquote {margin: 10px 0px 10px 0px; padding: 10px 10px 10px 10px; background: #F5F5F5; border-left: 2px solid #696969;}
.force-break {padding-bottom:40px;}
.navigation {text-align:center; margin:20px 0px 20px 0px;}
.navigation a {font-size:10; color:#56A5DF; text-decoration:none;}
.navigation a:hover {color:#120B7F; text-decoration:none;}
.author .avatar {float:left; border:none; padding:0px 20px 0px 0px;}
.author .about-text {padding:20px 0px 0px 0px;}

/******************** IMAGES ********************/
img.alignright {float:right; border:none; margin:0px 0px 10px 10px;}
img.alignleft {float:left; border:none; margin:0px 10px 10px 0px;}
img.aligncenter {display: block; border:none; margin:10px auto 10px auto;}
a img.alignright {float:right; border:none; margin:0px 0px 10px 10px;}
a img.alignleft {float:left; border:none; margin:0px 10px 10px 0px;}
a img.aligncenter {display: block; border:none; margin:10px auto 10px auto;}
.wp-caption {border: 1px solid #ddd; text-align: center; background-color: #f3f3f3; padding-top: 4px; margin: 10px; -moz-border-radius: 3px; -khtml-border-radius: 3px; -webkit-border-radius: 3px; border-radius: 3px;}
.wp-caption img {margin: 0; padding: 0; border: 0 none;}
.wp-caption p.wp-caption-text {font-size: 11px; line-height: 17px; padding: 0 4px 5px; margin: 0;}
.gallery {margin:auto;}
.gallery-image {border:none; margin-left:0;}
.gallery-caption {margin-left:0;}
.gallery-item {float:left; text-align:center; margin-left:0;}
.gallery-columns-2 {width: 50%;}
.gallery-columns-3 {width: 33%;}
.gallery-columns-4 {width: 25%;}
.gallery-columns-5 {width: 20%;}
.gallery-columns-6 {width: 16%;}
.gallery-columns-7 {width: 14%;}
.gallery-columns-8 {width: 12%;}
.gallery-columns-9 {width: 11%;}

/******************** COMMENTS ********************/
.commentblock {margin: 0px 10px 20px 0px; padding: 10px 20px 10px 20px;}
.commentlist {font-style:normal;}
.commentlist li {list-style-image: none; list-style-type: none; margin: 10px 0px 0px 0px; padding: 10px 10px 10px 10px;}
.commentlist li.bypostauthor {margin: 10px 0px 10px 0px; padding: 10px 10px 10px 10px; background:transparent;  border-top: 2px solid #696969; border-left: 2px solid #696969;}
.commentlist li.pingback {margin: 10px 0px 10px 0px; padding: 10px 10px 10px 10px; background: #F9F9F9;}
.commentlist li.trackback {margin: 10px 0px 10px 0px; padding: 10px 10px 10px 10px; background: #F9F9F9;}
.commentlist li ul li {list-style-image: none; list-style-type: none; background: none; margin: 10px 0px 0px 0px; padding: 10px 10px 10px 10px;}
.commentlist li ul li ul li {list-style-image: none; list-style-type: none; background: none; margin: 10px 0px 0px 0px; padding: 10px 10px 10px 10px;}
.commentlist li.comment ul.children li.bypostauthor {margin: 10px 0px 10px 0px; padding: 10px 10px 10px 10px; background: transparent;  border-top: 2px solid #696969; border-left: 2px solid #696969;}
.comment {margin: 10px 0px 10px 0px; padding: 10px 10px 10px 10px; border-top: 2px solid #696969; border-left: 2px solid #696969;}
.commentlist li div.vcard img.avatar {float:left; border: 1px solid #696969;}
.commentlist li.comment div.vcard span.says {text-transform: lowercase; font-style: italic;}
.commentlist li.comment div.commentmetadata {color: #1F1F1F; font-size: 10px; font-style:italic; margin: 0px 0px 30px 70px;}
.vcard cite.fn {text-transform: uppercase; font-style: italic; font-weight: bold; padding: 0px 0px 0px 10px;}
.comment-author a {color:#56A5DF; text-decoration:none; text-transform: uppercase;}
.comment-author a:hover {color:#120B7F; text-decoration:none;}
.comment-meta a {color:#56A5DF; text-decoration:none;}
.comment-meta a:hover {color:#120B7F; text-decoration:none;}
.reply a {color:#56A5DF; text-decoration:none;}
.reply a:hover {color:#120B7F; text-decoration:none;}
.comments, .respond {font-size: 14px; font-weight:normal;}
#author, #email, #url, #comment, #submit {background: transparent; border: 1px solid #696969;}

help please…

Make sure that you have added the conditional call to ie.css in header.php after the call to style.css – otherwise any chnages you add to ie.css will be over-written by style,css and won’t work.

You then need to start adjusting the CSS in ie.css yourself. Use NotePad or another plain text editor. It’s all down to experimentation until you find what works with your theme in IE7

this is my header.php

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "https://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="https://www.w3.org/1999/xhtml">
<head profile="https://gmpg.org/xfn/11">
<meta http-equiv="Content-Type" content="<?php bloginfo('html_type'); ?>; charset=<?php bloginfo('charset'); ?>" />
<meta name="distribution" content="global" />
<meta name="robots" content="follow, all" />
<meta name="language" content="en, sv" />
<meta name="generator" content="WordPress <?php bloginfo('version'); ?>" />
<!-- leave this for stats please -->

<title>
  <?php wp_title(''); ?>
  <?php if(wp_title('', false)) { echo ' |'; } ?> <?php bloginfo('name'); ?>
</title>

<link rel="alternate" type="application/rss+xml" title="RSS 2.0" href="<?php bloginfo('rss2_url'); ?>" />
<link rel="alternate" type="text/xml" title="RSS .92" href="<?php bloginfo('rss_url'); ?>" />
<link rel="alternate" type="application/atom+xml" title="Atom 0.3" href="<?php bloginfo('atom_url'); ?>" />
<link rel="pingback" href="<?php bloginfo('pingback_url'); ?>" />
<?php wp_head(); ?>
<style type="text/css" media="screen">
<!-- @import url( <?php bloginfo('stylesheet_url'); ?> );  -->
</style>
</head>

<body>

<div class="wrap">

	<div class="header">
  		<h1><a href="<?php bloginfo('url'); ?>"><?php bloginfo('name'); ?></a></h1>
	</div>
<!-- end header -->

	<?php include(TEMPLATEPATH."/sidebar.php");?>

	<div class="content">

tell me please where exactly should i place conditional

<!--[if IE]>
<link rel="stylesheet" href="<?php bloginfo('template_directory'); ?>/ie.css" media="screen" type="text/css" />
<![endif]-->

?

thanx very much.

The article I listed above explains it.