look at the source code for scaffolding.html<http://twitter.github.com/bootstrap/scaffolding.html> I learned how to use bootstrap by copy and pasting then editing parts of this page. view-source:http://twitter.github.com/bootstrap/scaffolding.html
Phil DoughtyWeb Designer / Guitarist Phone: +971 50 8879936 On 4 November 2012 21:00, Juli87 <[email protected]> wrote: > Thank you, that helps a lot! The image fits now in my layout and the > responsive design works. If i minimize the screen the border is shown. Is > it also possible to show the vertical border aligned to the image as it was > before? > > Now the site looks like this: http://juli.beluto.com/test.html > > Am Sonntag, 4. November 2012 16:23:33 UTC+1 schrieb Phil Doughty: >> >> Avoid using pixel values for main layout. Bootstrap has it's own strong >> layout grid system that works very well in most cases. >> >> As you probably already know .container is an existing class in >> bootstrap with it's on responsive px width's. >> So there is no need to include the a fixed pixel width. Otherwise your >> design will break. >> >> To keep the grey border, In your file style.css change the class name >> from .main.container name to simply .main >> >> .main{ >> >> 1. border: 1px solid #EEE; >> 2. padding: 0px 30px; >> >> } >> >> Also the classes .footer and .titelbild will create problems because of >> the fixed width values. >> >> Phil DoughtyWeb Designer / Guitarist Phone: +971 50 8879936 >> >> >> >> >> >> On 4 November 2012 17:34, Juli87 <[email protected]> wrote: >> >>> Thanks for your answer. But isn't there a possibility to create that >>> container outline and the oversized image without giving a fixed width? >>> >>> >>> Am Sonntag, 4. November 2012 14:09:56 UTC+1 schrieb Phil Doughty: >>> >>>> When possible try to use the existing bootstrap span grid classes >>>> & remove the fixed width px values from these classes: >>>> >>>> .titelbild >>>> .main.container >>>> .footer >>>> >>>> >>>> >>>> >>>> >>>> Phil DoughtyWeb Designer / Guitarist Phone: +971 50 8879936 >>>> >>>> >>>> >>>> >>>> >>>> On 4 November 2012 16:42, Juli87 <[email protected]> wrote: >>>> >>>>> I'm making a website with responsive design based on twitter >>>>> bootstrap, but my responive design doesnt't work well... I oversize an >>>>> image by giving a fixed width, so that it's outside the bootstrap grid. If >>>>> i minimize the screen the image isn't fluid. Is there another possibility >>>>> to extend the image and main container, so that it flows over the >>>>> bootstrap >>>>> grid? I want that the border of the main container has the same width like >>>>> the oversized image. If I have the screensize of a smartphone the >>>>> oversized >>>>> border can be cut. >>>>> >>>>> My site how it looks like now: >>>>> http://juli.beluto.com/test.**ht**ml<http://juli.beluto.com/test.html> >>>>> >>>> >>>> >>
