Hi Clyde,
can you help with stylesheet.css to make a few tweaks to the template. I'm trying to acheive the same rounded boxes for the center box as you have with the sidebox content backgrounds. My current stylesheet has already been slightly modified but only as far as the colours go and adding a background image to my header to match my logo. I'm also trying to acheive this look by horizontally aligning the center box with the sidebox sidebox_header_bg.gif image.
Can this be achieved with the current stylesheet?
Best regards,
Giles.
I'm running your most recent release of the template & v.1.3.9h my test website can be found at www.a19bs.com/shop/
easiest way:
open includes/templates/glacial_age/css/stylesheet.css
find the following declaration and add the highlighted portion.
#centerOuterBorder {
margin: 10px auto; /*gives spacing at top and bottom*/
padding: 15px 15px 15px 15px; /*spacing between this and the mainWrapper*/
background: #6c90dc;
/*width: 850px;*/
border:2px solid #6c90dc;
-moz-border-radius: 10px;
-webkit-border-radius: 10px;
border-radius:10px;
}
Only works for non IE browsers due to it being CSS3. Any other ideas?
Giles.
For pure simplicity and ease of implementation, I find it worth the inconvenience of losing the effect in just one browser.
there are many tutorials on implementing rounded corners available, just do a google search.
try this one ( http://www.spiffycorners.com/ )
or this one ( http://www.html.it/articoli/nifty/index.html )
Agreed in the end with you Clyde. Just added the CSS3 code and all is working well.
However I'm seeing another problem with the center box in ie8 and FF (havent checked other browsers yet).
Some items are falling outside of the center box. This can be seen best using this link.
http://www.a19bs.com/shop/index.php?main_page=page_2
It can also be seen at the following link where the buttons are outside of the light blue center box.
http://www.a19bs.com/shop/index.php?...e=shippinginfo
Fault 2 only occurs in ie8 after the addition of the CSS3 code that you provided.
Do you have any ideas?
Cheers, Giles.
Ignore problem 1(link 1) i've managed to resolve that one.
Open the stylesheet.css and add the following
.clearfix:after {
clear: both;
content: '.';
display: block;
visibility: hidden;
height: 0;
}
.clearfix {display: inline-block;}
* html .clearfix {height: 1%;}
.clearfix {display: block;}
Open tpl_page_2_default.php find the following
and replace with thisCode:<div id="pageTwoMainContent" class="content">
open tpl_shippinginfo_default.php find the followingCode:<div id="pageTwoMainContent" class="content clearfix">
and replace with thisCode:<div id="shippingInfoMainContent" class="content">
Code:<div id="shippingInfoMainContent" class="content clearfix">