Jump to content
npn2531

OSC to CSS v2

Recommended Posts

Looking closer at your question I see what you are asking. Nothing wrong with adding an extra div, but that should not be necessary.

 

You can do this by doing nothing more than changing the stylesheet.

 

If

.infobox, .infoboxcontents, .infobox-image{text-align:center;}

does not center the image then rest assured that something else in the stylesheet is overriding it.

 

Try

#column_left  .infobox-image{text-align:center;}

 

or even

 

img {text-align:center;}

 

Some combination will work. Try putting your guesses at the bottom of the stylesheet.

 

try this:

 

img.infoboxcontents{
text-align:center;
}

Edited by npn2531

Oscommerce site:

 

 

OSC to CSS, http://addons.oscommerce.com/info/7263 -Mail Manager, http://addons.oscommerce.com/info/8120

Share this post


Link to post
Share on other sites

I'm implementing this on a 1200 pixel grid. I updated my 960.css file accordingly. I'm having just an issue with my grid breaking down somewhere and can't figure out where. This is causing the footer to not display.

In my working test install I should be getting html like this.

 

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html lang="en" dir="LTR">
<head>
<body>
<div class="container_24">
<div id="header" class="grid_24">
<div class="clear"></div>
<div id="column_left" class="grid_5">
<div id="content" class="grid_14">
<div id="column_right" class="grid_5">
<div class="clear"></div>
<div id="footer" class="grid_24">
<div class="clear"></div>
</div>
<div class="ui-dialog ui-widget ui-widget-content ui-corner-all " style="display: none; z-index: 1000; outline: 0px none;" tabindex="-1" role="dialog" aria-labelledby="ui-dialog-title-1">
</body>
</html>

 

But what I get is this below in a site I am converting to this new version of osc-css with a 1200 grid.

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html lang="en" dir="LTR">
<head>
<body>
<div class="container_24">
<div id="header" class="grid_24">
<div class="clear"></div>
<div id="column_left" class="grid_5">
<div id="content" class="grid_14">
<div id="column_right" class="grid_5">
</div>
<div class="cart_status" style="display: none;"></div>
</body>
</html>

 

You might need to paste these into your favorite file comparison tool to see the difference. I'm also not sure why the div class for cart_status is not pulling in the correct results. I checked my working code vs. non working code in the relevant areas and all is the same. So I am missing something but not sure where the problem lies.

Thanks for any assistance.

Share this post


Link to post
Share on other sites

I'm implementing this on a 1200 pixel grid. I updated my 960.css file accordingly. I'm having just an issue with my grid breaking down somewhere and can't figure out where. This is causing the footer to not display.

In my working test install I should be getting html like this.

 

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html lang="en" dir="LTR">
<head>
<body>
<div class="container_24">
<div id="header" class="grid_24">
<div class="clear"></div>
<div id="column_left" class="grid_5">
<div id="content" class="grid_14">
<div id="column_right" class="grid_5">
<div class="clear"></div>
<div id="footer" class="grid_24">
<div class="clear"></div>
</div>
<div class="ui-dialog ui-widget ui-widget-content ui-corner-all " style="display: none; z-index: 1000; outline: 0px none;" tabindex="-1" role="dialog" aria-labelledby="ui-dialog-title-1">
</body>
</html>

 

But what I get is this below in a site I am converting to this new version of osc-css with a 1200 grid.

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html lang="en" dir="LTR">
<head>
<body>
<div class="container_24">
<div id="header" class="grid_24">
<div class="clear"></div>
<div id="column_left" class="grid_5">
<div id="content" class="grid_14">
<div id="column_right" class="grid_5">
</div>
<div class="cart_status" style="display: none;"></div>
</body>
</html>

 

You might need to paste these into your favorite file comparison tool to see the difference. I'm also not sure why the div class for cart_status is not pulling in the correct results. I checked my working code vs. non working code in the relevant areas and all is the same. So I am missing something but not sure where the problem lies.

Thanks for any assistance.

 

 

Got it resolved, I just had something in a custom infobox in the right column that was the problem. Took awhile to figure that out. Maybe this helps someone if they have a similar issue.

Share this post


Link to post
Share on other sites

Create an account or sign in to comment

You need to be a member in order to leave a comment

Create an account

Sign up for a new account in our community. It's easy!

Register a new account

Sign in

Already have an account? Sign in here.

Sign In Now

×