Return to Help Center

Welcome to the Bravenet Help Forums. Here you can chat and meet other Bravenet Members. Please do not post advertisements.

Forum: Coding Discussions
Start a New Topic 
  
Author
Comment
Full Width Images

I'm not hip to CSS, but i figure it must be somewhat simple to change the code
to allow an image to be displayed so that it fills the entire browser width?

Email  
Re: Full Width Images

If the image won't fill the entire browser width there are two possible reasons:

1. It is simply too small
2. You have explictly restricted the width of the display

Re: Full Width Images

Try the following CSS code in the body section of your CSS:



body {background: url("insert file link") top center;
background-size: cover;
background-attachment: fixed;
}

The 'fixed' statement will keep the image stationary while the rest of the site scrolls over it. If you want the image to scroll, swap 'fixed' for 'scroll'.

I hope this helps you.

Email  
Re: Full Width Images

Quote: David
I'm not hip to CSS, but i figure it must be somewhat simple to change the code
to allow an image to be displayed so that it fills the entire browser width?


If you want the background to cover the screen you should use a small image that tiles nicely, large wall-paper sized images load slowly and use a lot of bandwidth. Avoid using something you might post on your desktop as a background image

If you have a small image and you want it tile the code would look something like
Code:

body
{
background: url(yourimage.jpg) repeat;
}

Re: Full Width Images

Here's an example of what i need to do:

https://www.davidalanharvey.com/


I would like to have the flexibility to allow any image i want to be full width, not a background image.

Thanks!

Email  
Re: Full Width Images

I answered that question at the beginning. Perhaps you should try asking the question that you actually want answered rather than leaving us to guess.

Re: Full Width Images

" You have explictly restricted the width of the display"

..... sorry Peter, that's the issue, editing the display width which is
part of Bravenet's theme. Is this something that can be changed?

Email