Volusion覆盖CSS页面宽度

时间:2014-04-15 08:51:04

标签: css override volusion

我对Volusion有一个绝对的噩梦!基本上,我想让我的页面更宽,以便我可以更多地适应它,并对页面的设置进行一些实验。 我已经尝试过编辑CSS但它要么没有改变,要么一切似乎都不合适!这是我尝试使用的CSS:     div.pages_available_text {      font-size:17px!important;      font-weight:bold!important;     }

a{text-decoration:none;}
a,a:visited,a:active{outline-style:none;}
a:hover{text-decoration:underline;
color:#79CDCD;}

img{border:none!important;}
.begin{border:none !important;}
.end{border:none !important;}
.bold{font-weight:bold !important;}
.highlight{color:#06a0cf !important;}
.left{float:left;}
.right{float:right;}
.clear{clear:both;}
.none{display:none !important;}
.block{display:block !important;}
.inline{display:inline !important;}


/* ############################### FIXES ############################### */
.qe_toolbar_ovr{z-index:9999 !important;} /*admin box*/

/* ############################### WINTER 09 STYLES ############################### */
.next_page_img{width:auto !important; height:auto !important;}
.previous_page_img{width:auto !important; height:auto !important;}
.soft_add_content_area span, .quantity{color:#000;}
.soft_add_wrapper {z-index:1100;}

/* ############################### PAGE WRAPPER ############################### */
body{
    background-color:#ffcd05;
    color:#505050;
    font: normal 17px Arial, Helvetica, sans-serif;
    margin:0;
    padding:0;
    text-align:center;
}

#page{
    margin:0 auto;
    text-align:left;
    width:980px;    
}
div{
       font-size: 15px;
       font:Arial, Helvetica, sans-serif;
}
#app {
      color:#FFFF00;
      font-size:20px;
      text-align:center;
      border-radius: 5px;
      background-color:#000000;
      clear:both;
      border:none;
      float:left;
      width:160px;
      padding:5px;
      font-family:Coolsville, Cursive, sans-serif;
      margin-bottom:10px;
}
#download {
     height:70px;
     width:71px;
}

#video {
      align:middle;
}

/* ############################### HEADER ############################### */
#header{
    background:url(../images/template/header_bg.jpg) no-repeat 22px 35px;
    height:180px;
    margin:0 auto;
    padding:0;
    position:relative;
    width:980px;
}
#header div#display_homepage_title{
    height:50px;
    left:22px;
    margin:0;
    padding:0;
    position:absolute;
    top:77px;
    width:400px;
}
#header div#display_homepage_title a{
    display:block;  
    height:100%;
    left:0;
    margin:0;
    padding:0;
    position:absolute;  
    text-align:left;    
    text-indent:-9999px;
    top:0;  
    width:100%;
}
#header div a#homepage_title{
    background:none;
    color:#2c2c2c;
    font-size:20px; 
    text-indent:0;
}

#header .top{   
    background:url(../images/template/divider.gif) repeat-x 0 bottom;
    color:#202020;
    font-size:13px;
    margin:0;
    padding:1px 1px 2px;
    text-align:right;
}
#header .top a{
    border-right:1px solid #202020;
    display:inline-block;
    color:#202020;
    font-size:13px;
    height:13px;
    padding:0 0px;
    vertical-align:middle;
}
.app {
        padding:10px;
}
.social {
      padding:5px;
      float:center;
}

/* ############################### SEARCH BOX */
#display_search{
    background:url(../images/template/searchBg.gif) no-repeat 0 0;
    float:right;
bottom:5px;
    height:21px;
    margin:12px 20px 0 0;
    width:213px;
}
#display_search form{
    height:100%;
    margin:0;
    padding:0;
    width:100%;
}
#display_search #search_input{
    background:none;
    border:none;
    color:#2c2c2c;
    display:block;
    float:left;
    font:normal 12px Arial, Helvetica, sans-serif;
    margin:0;
    padding:4px 10px 2px 10px;
    text-align:left;
    width:168px;
}
#display_search #search_submit{
    background:none;
    border:none;
    color:#fff;
    cursor:pointer;
    display:block;
    float:right;
    font-size:0;
    height:21px;
    margin:0;
    padding:0;
    text-align:right;
    text-indent:-9999px;
    width:24px;
}

/* ############################### SHOPPING CART DISPLAY */
#header .cart{
    color:#202020;
    font-size:13px;
    float:right;    
    margin:8px 8px 0 0;
    text-align:right;
}
#header .cart a{color:#202020;}

#display_cart_summary, 
.cartsummary_full, 
.cartsummary_empty{display:inline;}
#display_cart_summary a{display:none !important;}

/* ############################### TOP NAVIGATION ############################### */
#topnav{
    background:url(../images/template/divider.gif) repeat-x 0 0;
    min-height:52px;
    margin:0 auto;
    padding:2px 0px 0;
    width:980px;
}

/* ############################### CONTENT ############################### */
#content{
    background:url(../images/template/contentBg.gif) repeat-y 0 0;  
    margin:0 auto;
    width:980px;    
}
#content .inner{

    padding:0px 10px 0;
margin-left:8px ;

}

/* ############################### LEFT_NAV ############################### */
#leftnav{
    float:left;
    width:190px;
}
#leftnav h3{
    font-size:17px;
    font-weight:normal;
    padding:5px 5px 5px 15px;
    text-transform:uppercase;
}
#leftnav .menu{padding-bottom:28px;}

/* ############################### PROMOTIONS */
#display_promotions_999{
    margin:0;
    padding:10px 0;
    text-align:center;
    vertical-align:middle;
    width:1200px;
}

/* ############################### CONTENT AREA ############################### */
#content_area{
    float:right;
    padding:0 10px;
    text-align:left;
    width:700px;
}

#content #content_area table{text-align:left;}

/* ############################### FOOTER ############################### */
#footer{

background:url(../images/template/contentBot.gif) no-repeat 0 0;
    margin:0 auto;
    padding-top:10px;
    width:980px;
}
#footer .top{
    background:#2c2c2c url(../images/template/footerBg.gif) no-repeat 0 bottom;
    color:#000000;
    font-size:13px;
    padding:20px 20px 15px;
    width:940px;
}

/* ############################### MAILING LIST */
#eList{
    float:right;
    width:186px;
}
#eList div.title{
    color:#ffcd05;
    font-size:13px;
    font-weight:bold;
    margin:0 5px 6px 0;
    text-align:right;
}
#eList form{
    background:url(../images/template/elistBg.gif) no-repeat 0 0;
    height:22px;
    margin:0;
    padding:0;
    width:186px;
}
#elist_input{
    background:none;
    border:none;
    color:#fff;
    display:block;  
    float:left;
    font:normal 11px Arial, Helvetica, sans-serif;
    margin:0;
    padding:5px 10px 3px 10px;
    text-align:left;    
    width:145px;
}
#elist_submit {
    background:none;
    border:none;
    color:#2c2c2c;
    cursor:pointer;
    display:block;
    float:right;
    font-size:0;
    height:22px;    
    margin:0;
    padding:0;
    text-align:right;
    text-indent:-9999px;
    width:20px;
}

#footer .top ul{
    float:left;
    list-style:none;
    margin:0;
    padding:0;
    width:188px;
}
#footer .top ul li.title{
    color:#ffcd05;
    font-weight:bold;
}
#footer .top ul li{
    color:#fff;
    font-size:13px;
    padding-bottom:4px;
}
#footer .top ul li a{
    color:#fff;
}
#footer .bottom{
    color:#505050;
    font-size:12px;
    line-height:20px;
    margin:20px auto;
    text-align:center;
    width:999px;
}
#footer .bottom a{
    color:#505050;
}

我可以使用HTML和CSS,但在任何其他方面都毫无绝对,我已经阅读了很多文章和论坛,但似乎无处可去!

1 个答案:

答案 0 :(得分:0)

如果您指的是mytoolkit.co.uk网站,那么您正在编辑错误的元素。您需要使页面容器div更宽,然后从那里开始工作。

在您的情况下,您似乎需要使用ID" page"编辑div。例如:

#page {width:1024px}

然后你可以编辑任何额外的子div,如标题,内容和页脚div。