CODEWITHSUNDEEP
htmlcssborder
technillogue
technillogue

Reputation: 1571

Why is this border not visible?

On this page, in the TESTIMONIALS section below the fold on the right, the content of the testimonial (the text in the <article> tag has a border:

.testimonial-entry.dark {
    background-color: #F6F6F5;
    border: 1px solid #D9D9D9;
}

Google Chrome's Developer Tools Computed Style viewer confirms that there really is a right border, that it's not being overwritten or anything:

border-right-color: rgb(217, 217, 217);
border-right-style: solid;
border-right-width: 1.1111111405455043px;

Nevertheless, the right border is not visible. Could anyone explain why?

Upvotes: 0

Views: 335

Answers (3)

Sergio
Sergio

Reputation: 28837

Its not shown because the div is too wide and goes outside .container. The section containing it (.one_half .last) is 451px wide and so is .testimonial-entry.dark but the li parent to it shifted it to the side.

If you change on your console the li's CSS margin-left: 18px to -1px you will see it, actually the whole border.

Solution is to make your articles more narrow, the element you need to afect is

.single-testimonial_3 li {width:330px;}

Upvotes: 2

Kuba
Kuba

Reputation: 189

Cause the parent html elements like div's ul's gives your article not enough space in the width. There are now many soultions to get this work. clean solutions with more work and quick soultion with less work.

One quick solutoin can be to give your article a fixed width that it fit in the parents html elements. Line 844 in your http://wowballoons.com/wp-content/themes/nevada/nevada/style.css?ver=1.6

.testimonial-entry.dark {
    background-color: #F6F6F5;
    border: 1px solid #D9D9D9;
    width: 316px;
}

Upvotes: 1

Daniel Apt
Daniel Apt

Reputation: 2638

.testimonial-entry.dark is going beyond your container. The right border is outside your container, and overflow is hidden, so you won't see it.

Make your article narrower.

.testimonial-entry dark {width: 315px; } should solve it.

Upvotes: 3

Related Questions