Checkout page layout alteration

Hi Nicolas
I think this is done in frontend css, but I'm not sure where.

I would like to make the white borders round the Login, Registration, Shipping Method and Payment Method the same as the ones on the left.
Also I'd like a 25px space between 'Login or create new account' and the boxes below.

Thanks for your help once again.

Nicholas - thank you, once again.

Hi Nicholas,

on my shop there are no white borders around the different parts of the checkout, but I would like to add them to tidy it up a bit. I presume I need to add the text:

fieldset{
border-color: #000000 !important;
}

somewhere in my CSS file but I can't find where. I've tried adding it in different places but it doesn't do anything on the front end. can you please tell me where to put the text?


my css file looks like this:

/* footer display */
div.hikashop_footer{
padding-top : 20px;
clear:both;
padding-bottom : 20px;
}

/* category display */
div.hikashop_category_image{
clear:both;
}
img.hikashop_category_image {
margin: 4px;
}
table.hikashop_subcategories_table tr td{
text-align:center;
}
#hikashop_subcategories div {
text-align:center;
}
.hikashop_subcategories, .hikashop_products{clear:both;}
.hikashop_category_list{
margin:0px;
}
.hikashop_category_left_part{
text-align:center;
}
.hikashop_category_right_part{
padding-left:1px;
}

.hikashop_category_list_item, .hikashop_product_list_item{
float:left;
}
.hikashop_product_list, .hikashop_category_list{
display: inline-block;
list-style-type: none;
text-align: left;
}


.hikashop_subcontainer{
padding-top:10px;
padding-bottom:10px;
}

/* product listing */
.hikashop_product_item_left_part{
text-align:center;
}
.hikashop_product_item_right_part {
margin-right: 20px;
margin-left: 20px;
}
.hikashop_product_image{
padding-bottom: 2px;
}

div.hikashop_subcontainer_border{
border: 1px solid;
}

/* different parts of the show of a product */
.hikashop_product_top_part{
width:100%;
}
.hikashop_product_left_part{
text-align:center;
float:left;
width:50%;
}
.hikashop_product_main_image_thumb{
margin-bottom:5px;
}

.hikashop_product_right_part{
float:left;
padding-left:1px;
}
.hikashop_product_bottom_part{
clear:both;
width:100%;
}
.hikashop_product_characteristic_chooser td{ padding: 3px !important; }
text-align:centre;
font-weight:bold;
}
.hikashop_product_variant_out_of_stock{
display:none;
}
.hikashop_product_variant_out_of_stock_span{
display:none;
}

.hikashop_product_quantity_field{
width:25px;
}
a.hikashop_product_quantity_field_change:hover{
text-decoration: none;
}
.hikashop_no_border tr, .hikashop_no_border td,
#hikashop_address_listing tr, #hikashop_address_listing td, #hikashop_address_form_span_iframe tr,
#hikashop_address_form_span_iframe td, #hikashop_product_quantity_main tr,#hikashop_product_quantity_main td,
#hikashop_checkout_page tr,#hikashop_checkout_page td, #hikashop_affiliate_main tr, #hikashop_affiliate_main td{
border:4px solid #000000;
}
#hikashop_order_listing fieldset,#hikashop_address_listing fieldsett{
border : 2px !important;}
} , #hikashop_affiliate_main fieldset{
border:1px solid #CCCCCC;
background-color:#FFFFFF;
}

div#hikashop_product_left_part div{
text-align:center;
}
div#hikashop_product_left_part img.hikashop_child_image{
margin : 2px;
height:25px;
}
.hikashop_product_code_main{
display:none;
}
.hikashop_product_weight_main{
display:none;
}
span.hikashop_product_name{
text-align: center;
display:block;
margin-bottom:5px;
}

/* prices display */
span.hikashop_product_price_before_discount{
text-decoration:line-through;
white-space:nowrap;
}
span.hikashop_product_price{
color:#FFFFFF;
white-space:nowrap;
}
span.hikashop_product_discount{
white-space:nowrap;
}
span.hikashop_product_price_full{
text-align: center;
font-weight:bold;
display:block;
margin-bottom:5px;
}
#hikashop_checkout_page .hikashop_product_price_full{
text-align: left;
}
span.hikashop_checkout_cart_coupon{
font-weight:bold;
}
span.hikashop_checkout_cart_shipping{
font-weight:bold;
}
span.hikashop_checkout_cart_taxes{
font-weight:bold;
}
span.hikashop_checkout_cart_final_total{
font-weight:bold;
color:#990000;
}

/* pagination */
.pagenav{
cursor:pointer;
}
.list-footer li{
list-style-type:none;
display: inline;
}

/* product name in the cart layout of the checkout process */
#hikashop_cart .hikashop_cart_product_name a{
font-weight:bold;
}
.hikashop_cart_product_name_value{
width:40%;
}

/* titles for cart display */
.hikashop_cart_title{
font-weight: bold;
}

.hikashop_small_cart_checkout_link,.hikashop_small_cart_clean_link,.hikashop_small_cart_total_title span,.hikashop_small_cart_total_title span span,.hikashop_small_cart_total_title span span span {
display:inline-block;
zoom:1;
*display:inline;
margin-bottom:0px;
}

/* next button of the checkout process */
#hikashop_checkout_next_button{
float:right;
}
#hikashop_checkout_shopping_button{
float:left;
}
.hikashop_submodules{
padding-top:30px;
}


/* cart buttons */
a.hikashop_cart_button, a.hikashop_cart_button:hover{
background-image:url(../images/button.jpg);
border:1px solid #356AA0;
color:#000000;
font-family:Verdana,Arial,Helvetica,sans-serif;
font-size:11px;
padding:5px 8px;
text-decoration:none;
cursor:pointer;
float:left;
white-space:nowrap;
}
a.hikashop_cart_button:hover{
outline: 2px solid #92C1FF;
}
#hikashop_order_listing a.hikashop_cart_button, #hikashop_order_listing a.hikashop_cart_button:hover,
#hikashop_checkout_login a.hikashop_cart_button, #hikashop_checkout_login a.hikashop_cart_button:hover{
float:none;
}

.hikashop_products a.hikashop_cart_button,.hikashop_products a.hikashop_cart_button:hover, #hikashop_checkout_coupon a.hikashop_cart_button,#hikashop_checkout_coupon a.hikashop_cart_button:hover{
float:none;
width:100px;
}

#hikashop_button_1 div.hikashop_container,#hikashop_button_2 div.hikashop_container,#hikashop_button_3 div.hikashop_container {
cursor:pointer;
}
#hikashop_button_1 div.hikashop_subcontainer, #hikashop_button_2 div.hikashop_subcontainer, #hikashop_button_3 div.hikashop_subcontainer,#hikashop_order_listing div.hikashop_subcontainer {
text-align:center;
}



/* checkout progress bar styles */
.hikashop_cart_bar{
background: url(../images/line.png) repeat-x scroll 100% 50% transparent;
padding-bottom:0;
padding-top:33px;
}
#hikashop_checkout_page div.hikashop_cart_bar{
text-align:center;
}
#hikashop_checkout_page .hikashop_cart_step.hikashop_cart_step_current {
-moz-background-inline-policy:continuous;
background: url("../images/current_step.png") no-repeat scroll 50% 3px transparent;
color:#363636;
}
#hikashop_checkout_page .hikashop_cart_step.hikashop_cart_step_finished {
-moz-background-inline-policy:continuous;
background: url("../images/finished_step.png") no-repeat scroll 50% 3px transparent;
color:#363636;
}
#hikashop_checkout_page div.hikashop_cart_step span {
position:relative;
left:4%;
width:auto;
}
#hikashop_checkout_page div.hikashop_cart_step span a {
color:#B2B2B2;
}
#hikashop_checkout_page .hikashop_cart_step.hikashop_cart_step_finished span a {
color:#363636;
}
.hikashop_cart_step {
-moz-background-inline-policy:continuous;
background: url("../images/step.png") no-repeat scroll 50% 3px transparent;
display:inline;
padding-top:20px;
padding-right:8%;
white-space:nowrap;
}


/* checkout login layout */
.hikashop_checkout_login{
border:1px;
clear:both;
width:690px;
margin:auto;
}
.hikashop_checkout_login_left_part{
width:250px;
float:left;
}
.hikashop_checkout_login_right_part{
width:440px;
float:left;
}

/* checkout address layout */
.hikashop_checkout_address{
clear:both;
width:800px;
margin:auto;
}
.hikashop_checkout_address_billing_only{
clear:both;
width:100%;
margin:auto;
}
.hikashop_checkout_billing_address{

}
.hikashop_checkout_address_left_part{
width:450px;
float:left;
}
.hikashop_checkout_address_right_part{
width:450px;
float:left;
}

/* checkout payment names */
.hikashop_checkout_payment_name{
font-weight: bold;
colour: #FFBF40;
}

/* checkout shipping names */
.hikashop_checkout_shipping_name{
font-weight: bold;
colour: #FFBF40;
}

.hikashop_custom_file_upload_link{
display:block;
}

.hikashop_red_border { border: 1px solid red; }

/* orders */
.hikashop_orders{
width:100%;
}
.hikashop_order_listing_status{
margin-bottom:5px;
display:block;
}

.hikashop_orders img{
border:none;
}

.hikashop_order_title{
text-align:center;
}
.hikashop_order_right_part{
float:right;
padding-top:20px;
}

div.hikashop_paypal_end_image input{
background: url(' www.paypal.com/en_US/i/btn/x-click-but6.gif ') top left no-repeat;
width:150px;
height:52px;
border:none;
cursor:pointer;
}

div.hikashop_alertpay_end_image input{
background: url(' www.alertpay.com/Images/BuyNow/pay_now_11.gif ') top left no-repeat;
width:150px;
height:52px;
border:none;
cursor:pointer;
}

.hikashop_authorize_thankyou{
text-align:center;
}

.hikashop_address_listing_div{
width: 300px ;
margin-left: auto ;
margin-right: auto ;
}
.hikashop_address_listing_table{
width:100%;
}
.hikashop_rbottom{clear:both;}
.clear_both{clear:both;}

/* sliders CSS for module categories display */
#pane h3 {margin:0;font-size:110%;letter-spacing:0px;}
.pane-sliders .title {margin:0;padding:5px;color:#666;cursor:pointer;}
.pane-sliders .panel {border:1px solid #ccc;margin-bottom:3px;}
.pane-sliders .panel h3 {background:#f6f6f6;color:#666;}
.pane-sliders .content {background:#ffffff;}
.pane-sliders div.content {padding:0px 10px 10px 10px;}
.jpane-toggler span {background:transparent url(../images/j_arrow.png) 5px 50% no-repeat;padding-left:20px;font-weight:700;}
.jpane-toggler-down span {background:transparent url(../images/j_arrow_down.png) 5px 50% no-repeat;padding-left:20px;font-weight:800;}
.jpane-toggler-down { border-bottom:1px solid #ccc;}

/* customer control panel */
#hikashopcpanel div.icon a {
border:1px solid #F0F0F0;
color:#666666;
display:block;
float:left;
text-decoration:none;
vertical-align:middle;
width:100%;
}
#hikashopcpanel div.icon:hover a {
-moz-background-clip:border;
-moz-background-inline-policy:continuous;
-moz-background-origin:padding;
background:#F9F9F9 none repeat scroll 0 0;
border-color:#EEEEEE #CCCCCC #CCCCCC #EEEEEE;
border-style:solid;
border-width:1px;
color:#0B55C4;
}
#hikashopcpanel div.icon {
float:left;
margin-bottom:5px;
margin-right:5px;
text-align:center;
width: 100%;
}
#hikashopcpanel span {
display:block;
text-align:center;
}
#hikashopcpanel img {
margin:0 auto;
padding:10px 0;
}
.hikashopcpanel{
width:500px;
margin:auto;
margin-top:20px;
}

.hikashop_header_title{ float: left; }
.hikashop_header_buttons{ float: right; }

/* affiliate program */
.hikashop_banner_row:hover{
}

/* icons */
.icon-32-cancel {background-image:url(../images/icons/icon-32-cancel.png);}
.icon-32-back {background-image:url(../images/icons/icon-32-back.png);}
.icon-32-new {background-image:url(../images/icons/icon-32-new.png);}
.icon-32-apply {background-image:url(../images/icons/icon-32-apply.png);}
.icon-32-save {background-image:url(../images/icons/icon-32-save.png);}
.icon-32-print {background-image:url(../images/icons/icon-32-print.png);}
.icon-48-order {background-image:url(../images/icons/icon-48-order.png);}
.icon-48-category {background-image:url(../images/icons/icon-48-category.png);}
.icon-48-user {background-image:url(../images/icons/icon-48-user.png);}
.icon-48-user2 {background-image:url(../images/icons/icon-48-user2.png);}
div.toolbar span {
display:block;
float:none;
height:32px;
margin:0 auto;
width:32px;
}
div.toolbar a {
border:1px solid #FBFBFB;
cursor:pointer;
display:block;
float:left;
padding:1px 5px;
text-align:center;
white-space:nowrap;
}

/* tool-tip */
.tool-tip {
float: left;
background-color: #ffc;
border: 1px solid #D4D5AA;
padding: 5px;
max-width: 200px;
}

.tool-title {
padding: 0;
margin: 0;
font-size: 100%;
font-weight: bold;
margin-top: -15px;
padding-top: 15px;
padding-bottom: 5px;
}

.tool-text {
font-size: 100%;
margin: 0;
}

/***************************************************************************/
/* Some Messages to display on a popup because the CSS is not fully loaded */
/***************************************************************************/

div.hikashop_messages{
border-bottom-style:solid;
border-bottom-width:2px;
border-top-style:solid;
border-top-width:2px;
font-weight:bold;
margin:5px 10px;
}

.hikashop_messages li{
list-style-type : none;
}

div.hikashop_warning{
background-color:#EFE7B8;
border-bottom-color:#F0DC7E;
border-top-color:#F0DC7E;
color:#CC0000;
}

div.hikashop_success{
background-color:#CCFFBB;
border-bottom-color:#00AA00;
border-top-color:#00AA00;
color:#00AA00;
}

div.hikashop_info{
background-color:#C3D2E5;
border-bottom-color:#84A7DB;
border-top-color:#84A7DB;
color:#0055BB;
}

div.hikashop_error{
background-color:#E6C0C0;
border-bottom-color:#DE7A7B;
border-top-color:#DE7A7B;
color:#CC0000;
}
#hikashop_add_to_cart_continue_div{
float:left;
}

#hikashop_add_to_cart_checkout_div{
float:right;
}

.hikashop_delete_entry_button{
float:right;
}

span.hiakshop_AUP_price{
color: #990000;
font-weight: bold;
}

span.hikashop_AUP_points{
color: #2f9900;
font-weight: bold;
}


/* pagination */
.hikashop_products_pagination, .hikashop_subcategories_pagination{
color:#167e93;
font-size:11px;
text-align:center;
margin-top:25px;
clear:both;
padding-top:20px;
}
.hikashop_products_pagination ul.pagination, .hikashop_subcategories_pagination ul.pagination{
text-align:center;
}

.hikashop_products_pagination .list-footer .limit, .hikashop_subcategories_pagination .list-footer .limit{
color:#167e93;
font-weight:bold;
margin-bottom:5px;
}

.hikashop_products_pagination .list-footer .limit .inputbox, .hikashop_subcategories_pagination .list-footer .limit .inputbox{
margin-left:10px;
border:1px solid #ccc;
color:#167e93;
}

.hikashop_products_pagination .list-footer .pagenav, .hikashop_subcategories_pagination .list-footer .pagenav {
color:#14caec;
font-weight:bold;
background-color:#FFF;
padding-right:5px;
padding-left:5px;
padding-top:2px;
padding-bottom:2px;
border:1px solid #ccc;
margin-right : 2px;
margin-left : 2px;
}
.hikashop_products_pagination .list-footer a.pagenav, .hikashop_subcategories_pagination .list-footer a.pagenav {
color:#14caec;
background-color:#FFF;
}

.hikashop_products_pagination .list-footer a.pagenav:hover, .hikashop_subcategories_pagination .list-footer a.pagenav:hover{
color:#fff;
background-color:#167e93;
}
.hikashop_products_pagination .list-footer span.pagenav, .hikashop_subcategories_pagination .list-footer span.pagenav {
color:#fff;
background-color:#167e93;
}
.hikashop_products_pagination .list-footer span.pagenav_text, .hikashop_subcategories_pagination .list-footer span.pagenav_text{
display:none;
}

.hikashop_products_pagination .list-footer .counter, .hikashop_subcategories_pagination .list-footer .counter{
color:#666;
margin-top:15px;
}

.hikashop_products_pagination .hikashop_results_counter, .hikashop_subcategories_pagination .hikashop_results_counter{
color:#666;
}



/* facebook and twitter */
#hikashop_social iframe.hikashop_social_fb_standard{
width:400px;
height:80px;
}

#hikashop_social iframe.hikashop_social_fb_button_count{
width:125px;
height:20px;
}

#hikashop_social iframe.hikashop_social_fb_box_count{
width:125px;
height:80px;
}

#hikashop_social{
position:relative;
text-align:left;
}

#hikashop_social{
position:relative;
text-align:right;
}

#hikashop_social span.hikashop_social_left_fb_tw_none{
position:relative;
left:75px;
}

#hikashop_social span.hikashop_social_left_fb_tw_vertical{
position:relative;
left:5px;
}

#hikashop_social span.hikashop_social_left_fb_tw_horizontal{
position:relative;
}
#hikashop_social span.hikashop_social_left_fb__standart_tw_none{
position:relative;
margin-left: 100px;
}
#hikashop_social span.hikashop_social_left_fb__standart_tw_none_google{
position:relative;
margin-left: 185px;
}
#hikashop_social span.hikashop_social_right_tw_none{
position:absolute;;
right:130px;
}

#hikashop_social span.hikashop_social_right_tw_none_fb_standart{
position: absolute;
right:420px;
top:2px
}

#hikashop_social span.hikashop_social_right_tw_horizontal{
position:absolute;
right:130px;
}

#hikashop_social span.hikashop_social_right_tw_horizontal_fb_standart{
position:absolute;
right:410px;
top:2px
}

#hikashop_social span.hikashop_social_right_tw_none_fb_box{
position:absolute;
right:125px;
}

#hikashop_social span.hikashop_social_right_tw_vertical_fb_standart{
position:absolute;
right:415px;
}


#hikashop_social span.hikashop_social_google_right_tw_none_fb_standart{
position:absolute;
right:500px;
top: 2px;
}
#hikashop_social span.hikashop_social_google_right_tw_horizontal_fb_standart{
position:absolute;
right:525px;
top: 2px;
}
#hikashop_social span.hikashop_social_google_right_tw_none{
position:absolute;
right:250px;
}
#hikashop_social span.hikashop_social_google_right_tw_vertical{
position:absolute;
right:215px;
}
#hikashop_social span.hikashop_social_google_right_fb_box{
position:absolute;
right:200px;
}
#hikashop_social span.hikashop_social_google_right_fb_box_tw_vert{
position:absolute;
right:220px;
}
#hikashop_social span.hikashop_social_google_left_tw_none_fb_standart{
position:absolute;
top: 0px;
}




#hikashop_social span.hikashop_social_left_tw{
position:relative;
margin-top:0px;
}

#hikashop_social span.hikashop_social_left_tw_2{
position:absolute;
top:2px;
}
#hikashop_social span.hikashop_social_left_tw_2_google{
position:absolute;
left:75px;
}
#hikashop_social span.hikashop_social_left_tw_box{
position:absolute;
left: 70px;
}
#hikashop_social span.hikashop_social_google_left_tw_fb_box{
position:absolute;
left: 135px;
}




.hikashop_option_info{
margin-left:5px;
}

.hikashop_checkout_cart_print_link{
float:right;
}

.hikashop_cart_product_quantity_delete, .hikashop_cart_product_quantity_refresh, .hikashop_product_quantity_field{
float:left;
}

/*Effect on product layout*/
.hikashop_img_pane_panel{
position: absolute;
bottom:0px;
background: rgba(0,0,0,0.;
background-color:black\9;
filter:alpha(opacity=80)\9;
text-align:center !important;
}

.hikashop_slide_numbers{
margin:2px;
}

.hikashop_slide_numbers:hover{
background-color:#0080ff;
color: white;
}

.hikashop_slide_pagination_selected{
color:white;
background-color:#0080ff;
}

.hikashop_pagination_images{
opacity:0.6;
display:inline-block\9;
-ms-filter:"progid:DXImageTransform.Microsoft.Alpha(Opacity=60)";
}

.hikashop_pagination_images:hover{
opacity:1;
-ms-filter:"progid:DXImageTransform.Microsoft.Alpha(Opacity=100)";
}

.hikashop_pagination_images_selected{
opacity:1;
-ms-filter:"progid:DXImageTransform.Microsoft.Alpha(Opacity=100)";
}

.hikashop_img_pane_panel{
position: absolute;
bottom:0px;
background: rgba(0,0,0,0.;
background-color:black\9;
filter:alpha(opacity=80)\9;
text-align:center !important;
}

.hikashop_slide_pagination{
text-align:center !important;
}

.hikashop_slide_dot_basic{
background: url("../images/icons/dot_basic.png") no-repeat;
margin:2px;
height:13px;
width:13px;
display:inline-block;
}

.hikashop_slide_dot_basic:hover{
background: url("../images/icons/dot_hover.png") no-repeat;
cursor:pointer;
}

.hikashop_slide_dot_selected, .hikashop_slide_dot_selected:hover{
background: url("../images/icons/dot_selected.png") no-repeat;
}

.hikashop_pagination_images_block{
margin:5px;
display:inline-block;
}


.hiakshop_slider_button{
opacity:0.5;
}

.hiakshop_slider_button:hover{
cursor:pointer;
opacity:1;
}

kind regards,
Tanya

hi Nicholas thanks for that.
I couldn't manage it with the text you stated (sorry I've never used css until i set up my website)
however i did manage to set a border of sorts. however the lines go around every cell and i only want the lines around each whole table - is there a way to do this?
I've attached a screen shot.