[Paul]

Hi there,

I have updated catchbox with the latest version. I don’t have a child template created, because my custom CSS always worked with the following CSS script:

Site: http://www.12daysofchristmaslyrics.com/

CSS Script:

/* For Large Screen */
#primary { width: 750px; }
#secondary { width: 180px; }
@media screen and (max-width: 1224px) {
	#primary { width: 750px; }
	#secondary { width: 180px; }
}
@media screen and (max-width: 1060px) {		
	#primary { width: 750px; }
	#secondary { width: 180px; }
}
@media only screen 
and (min-device-width : 768px) 
and (max-device-width : 1024px) 
and (orientation : landscape) {
	#primary { width: 750px; }
	#secondary { width: 180px; }
}
@media screen and (max-width: 960px) {	
	#primary, #secondary { width: 100%; }
}

input#s {
-moz-border-radius: 5px;
border-radius: 5px;
font-size: 14px;
height: 22px;
line-height: 1.2em;
padding: 10px 4px 1px 18px;
  
  }

In the site you can see that that the content column don’t match anymore. I did adjustments in the width, but nothing gets through. Anyone can help me with the updated version and get get the width in order ?.

Good luck to you all.

[Sakin]

@Paul: Sorry I am bit confused. I don’t see any issue in the layout.
you can replace your current custom css:

/* For Large Screen */
#primary { width: 750px; }
#secondary { width: 180px; }
@media screen and (max-width: 1224px) {
	#primary { width: 750px; }
	#secondary { width: 180px; }
}
@media screen and (max-width: 1060px) {		
	#primary { width: 750px; }
	#secondary { width: 180px; }
}
@media only screen 
and (min-device-width : 768px) 
and (max-device-width : 1024px) 
and (orientation : landscape) {
	#primary { width: 750px; }
	#secondary { width: 180px; }
}
@media screen and (max-width: 960px) {	
	#primary, #secondary { width: 100%; }
}

With the following css:

@media screen and (min-width: 961px) {
    #primary { width: 670px; }
    #secondary { width: 180px; }
}
@media screen and (min-width: 991px) {
    #primary { width: 720px; }
}
@media screen and (min-width: 1024px) {
    #primary { width: 750px; }
}

[Author]

Posts