Jump to content

Archived

This topic is now archived and is closed to further replies.

B1Guy

Image border around content

Recommended Posts

B1Guy

I've seen a few topics on this but nothing that has truly worked for me

I'm trying to have a image border from top of header to bottom of footer but not around individual sections

this is the code I'm almost there with

.content{
    border: 15px solid transparent;
    width: 1100px;
    padding: 0px 0px;
}
.content {
}
 
here is the site
any help would be great
Thank You

Share this post


Link to post
Share on other sites
Danny

HI,

 

To do this, you will need to stop targeting the .content class, as each section has a content class and therefore, by using that class, you're applying that styling to each section/region.

 

Therefore, to resolve your issue, you're going to need to target each content area for that region and apply border-left, border-right etc..

 

#branding .content {
border-left: 20px solid;
border-right: 20px solid;
border-bottom: 0;
}
 
Then repeat the process for each each section you have used. Please be aware that by doing this you will require extensive CSS and this isn't something we can provide assistance with.

Please search our forums, before posting!

Share this post


Link to post
Share on other sites
B1Guy

I did see something similar in another post I guess then my main problem is the main content area I have tried your answer in this post  http://forum.pagelines.com/topic/31400-border-around-content-but-not-each-individual-section/

but it only seamed to work with solid colours not images and if maybe you could tell me what the section is called for the main content area is called I can figure it out.

Thank you for your reply 

Share this post


Link to post
Share on other sites
Danny

Have you now resolved this, as I just viewed your site and you have a border round all your content?


Please search our forums, before posting!

Share this post


Link to post
Share on other sites
B1Guy

Yes I was able to figure it out by calling out each section

#nav .content {
border-top: 15px solid;  
border-left: 15px solid;
border-right: 15px solid;
}
#branding .content-pad{ padding: 10px;}
#branding .content {
border-left: 15px solid;
border-right: 15px solid;
}
#content .content {
border-left: 15px solid;
border-right: 15px solid;
}
#navbar .content-pad{ padding: 0px;}
#navbar .content {
border-left: 15px solid;
border-right: 15px solid;
}
#footer .content {
border-left: 15px solid;
border-right: 15px solid;
border-bottom: 15px solid;
}
 

Thank you for your help

Share this post


Link to post
Share on other sites
Danny

Awesome and nice job!


Please search our forums, before posting!

Share this post


Link to post
Share on other sites

×