Community Forums › Forums › Archived Forums › Design Tips and Tricks › How to remove Border on Executive theme
- This topic has 5 replies, 3 voices, and was last updated 10 years, 3 months ago by jtdatawork.
-
AuthorPosts
-
November 23, 2013 at 7:43 pm #75319jtdataworkMember
There appears to be a 1 pixel white right and left side border on the slider area and the main content area that I can't remove. I've tried to identify where it is in the CSS with my CSS tool, but no luck. Can anyone help me? I'd be most grateful for any thoughts.
http://margaretgodfreyart.com/
JT Dataworks Web design and SEO
November 24, 2013 at 5:39 am #75343Brad DaltonParticipantLooking at the CSS code for the slider, i can't see any border. It may be your background image which is causing this.
/* Genesis Responsive Slider --------------------------------------------- */ .home-slider li { margin: 0; padding: 0; } .content #genesis-responsive-slider { background: none; border: none; padding: 0; } .content .genesis_responsive_slider .slide-excerpt { background-color: #222; filter: alpha(opacity=100); height: 100%; margin: 0; padding: 4% 5.5%; opacity: 1; } .content .genesis_responsive_slider .slide-excerpt-border { border: none; margin: 0; padding: 0; } .content .genesis_responsive_slider h2, .content .genesis_responsive_slider h2 a { color: #fff; font-size: 20px; font-size: 2rem; font-weight: 700; text-transform: uppercase; } .content .genesis_responsive_slider p { color: #ddd; } .content .genesis_responsive_slider p a { display: block; margin-top: 20px; margin-top: 2rem; } .content .genesis_responsive_slider .flex-direction-nav li a { background: url(images/icon-direction-nav.png) no-repeat -50px 0; background-size: 100px 98px; height: 49px; right: -25px; -webkit-transition: none; -moz-transition: none; -ms-transition: none; -o-transition: none; transition: none; width: 50px; } .content .genesis_responsive_slider .flex-direction-nav li a:hover { background-position: -50px -49px; } .content .genesis_responsive_slider .flex-direction-nav li a.prev { background-position: 0 0; left: -25px; } .content .genesis_responsive_slider .flex-direction-nav li a:hover.prev { background-position: 0 -49px; } .content .genesis_responsive_slider .flexslider .slides > li { overflow: hidden; } .content .genesis_responsive_slider .flex-control-nav { margin: -50px 0 0 60px; text-align: left; } .content .genesis_responsive_slider .flex-control-nav li a { background: url(images/icon-control-nav.png) no-repeat 0 0; background-size: 13px 39px; } .content .genesis_responsive_slider .flex-control-nav li a:hover { background-position: 0 -13px; } .content .genesis_responsive_slider .flex-control-nav li a.active { background-position: 0 -26px; }
How did you add your background image?
November 24, 2013 at 12:21 pm #75384jtdataworkMemberThe 1 px white border appears both on the slider area and the widget area, but not on the title area or the footer area, and as you point out, there is no border in the CSS in either that I can find and it's driving me crazy. 🙂
The slider area is currently displaying a photo in a text widget. That photo has no border, nor does the code in the widget and I can't find any borders on images in the CSS. I just checked all three again.
The site background image is here in the CSS
body {
background: #f2f2f2 url(http://margaretgodfreyart.com/wp-content/uploads/painting-bg.jpg);
color: #222;
font-family: 'Open Sans', 'Helvetica Neue', Helvetica, Arial, sans-serif;
font-size: 16px;
font-size: 1.6rem;
line-height: 1.6;
}
no reason for it to impact the slider or widget areas, it is a large photo and is tiled. I had not done any adjusting to the slider area when I noticed the border, just assumed it was the CSS. Now I'm not sure what is causing it. I'm stumped
JT Dataworks Web design and SEO
November 27, 2013 at 6:18 pm #75978jtdataworkMemberI've looked at the original demo of the theme and there is definitely a visible white border/box on the demo's slider. Searched the CSS for "border" but still can't find it. 🙁
JT Dataworks Web design and SEO
November 27, 2013 at 10:48 pm #75994pathetixMemberDiv class="site-container" has a box-shadow applied.
What you can do is add this css:
.site-inner {box-shadow: none;}
December 18, 2013 at 8:44 pm #80086jtdataworkMemberTHANK YOU pathetix! I looked and looked for that. I was able to just go in and change it to 0px. You made my day!
Judy
JT Dataworks Web design and SEO
-
AuthorPosts
- The forum ‘Design Tips and Tricks’ is closed to new topics and replies.