sweet let me punch that in, really greatful for all of the help!
On Friday, 17 August 2012 02:44:32 UTC+10, Ryan wrote: > > I'm not sure why you are using the pull-right. Based on the image you sent > out, you should be able to achieve that entirely with using scaffolding. > The attached image is the output of the code I pasted before with soem > lorum ipsum insterted: > > [image: Inline image 1] > > On Thu, Aug 16, 2012 at 11:48 AM, Backspace > <[email protected]<javascript:> > > wrote: > >> I think the 'pull-right' class is messing things up - however I have no >> other way to get this box to work 'inline' >> >> >> On Friday, 17 August 2012 01:40:23 UTC+10, Barry vd. Heuvel wrote: >> >>> Or use border-box, to apply the padding without changing the width ;) >>> >>> On Thu, Aug 16, 2012 at 5:35 PM, Backspace <[email protected]>wrote: >>> >>>> I have something looking pretty good - using a pull right on the span >>>> class though. The gutter is not ideal (too thick, I can look at less for >>>> that right). not sure why padding seems to affect boxes. wait I should >>>> apply the padding to the elements inside the wells. arrrr >>>> >>>> On Friday, 17 August 2012 00:46:10 UTC+10, Ryan wrote: >>>> >>>>> That's how I would do it, yes. >>>>> >>>>> span12 >>>>> row >>>>> span10 offset1 >>>>> row >>>>> //more stuff >>>>> >>>>> >>>>> On Thu, Aug 16, 2012 at 10:39 AM, Backspace <[email protected]>wrote: >>>>> >>>>>> So it's ok to have margin on-top /bottom, just not left-right. >>>>>> >>>>>> I have my stuff contained within a span 10 with an offset of 1. >>>>>> >>>>>> I really have a lot more questions. I have been fool with the code >>>>>> for a while now. >>>>>> >>>>>> edit making progress, got something to line up that was annoying for >>>>>> ages (removed some padding) >>>>>> >>>>>> Edit - Padding left or right, will affect the box, I see it now. >>>>>> >>>>>> >>>>>> - adjusting colour on span 10 'container' so the span 12 .... >>>>>> >>>>>> Question, I center a span 10 - inside a span 12with span 10 offset1 >>>>>> >>>>>> Is this the best way? I can post all of the code if needed, make it >>>>>> look the way I think it should look. >>>>>> >>>>>> >>>>>> >>>>>> >>>>>> On Thursday, 16 August 2012 23:44:35 UTC+10, Backspace wrote: >>>>>>> >>>>>>> ok that makes sense.So I can just remove the width (either margin or >>>>>>> padding) on any classes, and nest to position? >>>>>>> >>>>>>> did you see my pull right class? According to what you say, this is >>>>>>> ok, it's not adding width. >>>>>>> >>>>>>> Oh I have a while to go. >>>>>>> >>>>>>> Is it ok for an element to 'butt' up against it's parent, is that >>>>>>> part of the grid? >>>>>>> >>>>>>> >>>>>>> >>>>>>> On Thursday, 16 August 2012 23:41:04 UTC+10, Barry vd. Heuvel wrote: >>>>>>>> >>>>>>>> You can throw in as many classnames as you like, just be sure to >>>>>>>> not change the total width. Just inspect with your developer tools, to >>>>>>>> check the width/margins/etc. >>>>>>>> >>>>>>>> On Thu, Aug 16, 2012 at 3:32 PM, Backspace >>>>>>>> <[email protected]>wrote: >>>>>>>> >>>>>>>>> thanks man >>>>>>>>> >>>>>>>>> >>>>>>>>> "When using the default box-sizing, the paddings and margins are >>>>>>>>> added to the width (see >>>>>>>>> http://css-tricks.com/box-**sizi******ng/<http://css-tricks.com/box-sizing/> >>>>>>>>> ), >>>>>>>>> so when you add those classes to the same element as .spanX, the grid >>>>>>>>> doesn't fit, so use them in a element inside the span, not on the >>>>>>>>> span >>>>>>>>> itself." >>>>>>>>> >>>>>>>>> So would say though >>>>>>>>> >>>>>>>>> so use them in a element inside the span (with no added margin >>>>>>>>> /padding) Hope that makes sense. I know what the box model is, but I >>>>>>>>> guess >>>>>>>>> I am missing something, >>>>>>>>> >>>>>>>>> In this context >>>>>>>>> >>>>>>>>> >>>>>>>>> <div class="row"> >>>>>>>>> <div class="span8"> >>>>>>>>> <di vclass="myclasswithmargin"/> >>>>>>>>> </div> >>>>>>>>> </div> >>>>>>>>> >>>>>>>>> <div class="row"> >>>>>>>>> <div class="span8 myclasswithmargin"/> >>>>>>>>> </div> >>>>>>>>> >>>>>>>>> ------ >>>>>>>>> Say css is for first one >>>>>>>>> >>>>>>>>> .myclasswithmargin { >>>>>>>>> margin:10px 4px 20px 10px; >>>>>>>>> } >>>>>>>>> >>>>>>>>> Would do the same thing if it was for the second one, screw with >>>>>>>>> the framework. It's not just where you put the code (perhaps even in >>>>>>>>> row) >>>>>>>>> as long as it does not fight the position of the structural elements. >>>>>>>>> >>>>>>>>> >>>>>>>>> This awesome example confuses me. The only dif >>>>>>>>> http://jsfiddle.net/Sherbrow/**p****npUW/embedded/result/<http://jsfiddle.net/Sherbrow/pnpUW/embedded/result/> >>>>>>>>> The onlyu dif in two examples is no class in row / but still in >>>>>>>>> span. Does that make sense? Because it confuses me, as you are >>>>>>>>> telling me >>>>>>>>> to further separate classes. I thought you could throw class names >>>>>>>>> into >>>>>>>>> divs willnilly. padding / margin aspects make sense though! >>>>>>>>> >>>>>>>>> >>>>>>>>> On Thursday, 16 August 2012 23:13:46 UTC+10, Barry vd. Heuvel >>>>>>>>> wrote: >>>>>>>>> >>>>>>>>>> The .spanX classes have a margin. When you give it an extra class >>>>>>>>>> with margin, you overwrite the first margin. So you cannot combine >>>>>>>>>> the >>>>>>>>>> spanX class with classwithmargin. >>>>>>>>>> >>>>>>>>>> When using the default box-sizing, the paddings and margins are >>>>>>>>>> added to the width (see http://css-tricks.com/box-**sizi****** >>>>>>>>>> ng/ <http://css-tricks.com/box-sizing/> ), so when you add those >>>>>>>>>> classes to the same element as .spanX, the grid doesn't fit, so use >>>>>>>>>> them in >>>>>>>>>> a element inside the span, not on the span itself. >>>>>>>>>> >>>>>>>>>> If you want to add padding/borders to the span elements, without >>>>>>>>>> changing the width, use border-box: >>>>>>>>>> http://paulirish.com/2012/box-********sizing-border-box-ftw/<http://paulirish.com/2012/box-sizing-border-box-ftw/> >>>>>>>>>> or >>>>>>>>>> the mixin: .box-sizing(@boxmodel); >>>>>>>>>> >>>>>>>>>> When you want to update easily, don't update the core bootstrap >>>>>>>>>> files, but overwrite them in a custom less file, you import after >>>>>>>>>> the >>>>>>>>>> bootstrap code (or custom css). This wil give more css output, but >>>>>>>>>> easier >>>>>>>>>> updates. >>>>>>>>>> >>>>>>>>>> On Thu, Aug 16, 2012 at 2:52 PM, Backspace < >>>>>>>>>> [email protected]> wrote: >>>>>>>>>> >>>>>>>>>>> Hi Barry >>>>>>>>>>> >>>>>>>>>>> That's what I was thinking, just use borders and padd content >>>>>>>>>>> inside of it, but leave the structural stuff to grid (starting to >>>>>>>>>>> get it). >>>>>>>>>>> I suspect this will help me with responsive adjustment. >>>>>>>>>>> >>>>>>>>>>> Question1: >>>>>>>>>>> >>>>>>>>>>> If I do this >>>>>>>>>>> >>>>>>>>>>> >>>>>>>>>>> <div class="row"> >>>>>>>>>>> <div class="span8"> >>>>>>>>>>> <di vclass="myclasswithmargin"/> >>>>>>>>>>> </div> >>>>>>>>>>> </div> >>>>>>>>>>> >>>>>>>>>>> is same as >>>>>>>>>>> >>>>>>>>>>> <div class="row"> >>>>>>>>>>> <div class="span8"**myclasswithmargin******"/> >>>>>>>>>>> </div> >>>>>>>>>>> >>>>>>>>>>> (keeping inheritance and stake order in mind of course). >>>>>>>>>>> >>>>>>>>>>> Q2 >>>>>>>>>>> Some of my elements contain specific padding / margin for >>>>>>>>>>> positioning. Do I need to contain these inside further structural >>>>>>>>>>> code to >>>>>>>>>>> ensure they respond according to the responsive features (I am >>>>>>>>>>> sticking to >>>>>>>>>>> fixed width boxes). I guess if it's not style, use the framework, >>>>>>>>>>> makes >>>>>>>>>>> perfect sense now. >>>>>>>>>>> >>>>>>>>>>> Q3 >>>>>>>>>>> I use a custom.css file to add anything I want on-top. I am >>>>>>>>>>> adding my own updates into My Less file, but I realised if I update >>>>>>>>>>> the >>>>>>>>>>> core I overwrite). Should I put all of my .less updates into a >>>>>>>>>>> .less file >>>>>>>>>>> called after the bootstrap .less files? What's best practice and >>>>>>>>>>> what's >>>>>>>>>>> light weight. >>>>>>>>>>> Q3a If you were working large scale project, would you even >>>>>>>>>>> auto update a site (with any type of frame work), or do it manually >>>>>>>>>>> (Add >>>>>>>>>>> bits of code from update as you see fit {as long as it works}) >>>>>>>>>>> >>>>>>>>>>> I have a few thousand lines of code to re-write. >>>>>>>>>>> >>>>>>>>>>> >>>>>>>>>>> >>>>>>>>>>> >>>>>>>>>>> >>>>>>>>>>> On Thursday, 16 August 2012 16:37:16 UTC+10, Barry vd. Heuvel >>>>>>>>>>> wrote: >>>>>>>>>>> >>>>>>>>>>>> The span classes are calculated to fit exactly. When you add >>>>>>>>>>>> extra styles that change the width, it doesn't fit. >>>>>>>>>>>> So you can use styling, bit nothing that makes it larger, so no >>>>>>>>>>>> border or margins/paddings. >>>>>>>>>>>> But you could use the border-box model, to create >>>>>>>>>>>> borders/paddings, without changing the width >>>>>>>>>>>> Op 16 aug. 2012 06:21 schreef "Backspace" < >>>>>>>>>>>> [email protected]> het volgende: >>>>>>>>>>>> >>>>>>>>>>>> Cool >>>>>>>>>>>>> >>>>>>>>>>>>> I am using my own well class in the less file. >>>>>>>>>>>>> >>>>>>>>>>>>> So to recap. <class "row"> >>>>>>>>>>>>> <class "span4"> >>>>>>>>>>>>> <class "mywell"/> >>>>>>>>>>>>> </div> >>>>>>>>>>>>> </div> >>>>>>>>>>>>> >>>>>>>>>>>>> Can any one lese confirm that placing class names in spans (my >>>>>>>>>>>>> own classes) is bad practice? I can see your point, it's jut >>>>>>>>>>>>> there will be >>>>>>>>>>>>> a load of reworking going into my site if that's the case. It >>>>>>>>>>>>> sounds fair >>>>>>>>>>>>> though. I can see sherbrow has pretty much confirmed this for me >>>>>>>>>>>>> too, I >>>>>>>>>>>>> just thought I could place my own class names alongside the span >>>>>>>>>>>>> class div >>>>>>>>>>>>> tag. So <div class="span 5 myclass"> >>>>>>>>>>>>> >>>>>>>>>>>>> It makes sense though. >>>>>>>>>>>>> >>>>>>>>>>>>> I have not had a chance to look at your code on how to achieve >>>>>>>>>>>>> the, let's call it 'float emulation', I am after. However I am >>>>>>>>>>>>> currently >>>>>>>>>>>>> pulling a row to the right. I guess this is bad too though. >>>>>>>>>>>>> >>>>>>>>>>>>> >>>>>>>>>>>>> -------------------------- >>>>>>>>>>>>> >>>>>>>>>>>>> On Thursday, 16 August 2012 12:14:56 UTC+10, Ryan wrote: >>>>>>>>>>>>>> >>>>>>>>>>>>>> Stupid IE 10 is sending blank messages when I reply. Guess >>>>>>>>>>>>>> that is what I get for using the release preview. So to recap, >>>>>>>>>>>>>> but shorter. >>>>>>>>>>>>>> >>>>>>>>>>>>>> I'm pretty sure it messes with the formatting, but this is >>>>>>>>>>>>>> also a better practice. Only use grid/scaffolding classes for >>>>>>>>>>>>>> layout, put >>>>>>>>>>>>>> visible content inside them. I would also add your own clas, >>>>>>>>>>>>>> instead of >>>>>>>>>>>>>> just well, so you can override the css in the future if you >>>>>>>>>>>>>> want. >>>>>>>>>>>>>> >>>>>>>>>>>>>> On Wed, Aug 15, 2012 at 8:49 PM, Backspace < >>>>>>>>>>>>>> [email protected]> wrote: >>>>>>>>>>>>>> >>>>>>>>>>>>>>> Hi Ryan, thnaks (and you too >>>>>>>>>>>>>>> Sherbrow) >>>>>>>>>>>>>>> >>>>>>>>>>>>>>> first question - >>>>>>>>>>>>>>> >>>>>>>>>>>>>>> With this code >>>>>>>>>>>>>>> >>>>>>>>>>>>>>> <div class="span5"><div class="content >>>>>>>>>>>>>>> well">content</div></div> >>>>>>>>>>>>>>> >>>>>>>>>>>>>>> Would this not be the same? >>>>>>>>>>>>>>> >>>>>>>>>>>>>>> <div class="span5 content well"></div> >>>>>>>>>>>>>>> >>>>>>>>>>>>>>> I am justa adding another couple of classes to the span 5. >>>>>>>>>>>>>>> Or are you sayin that the margins / padding in span 5 and well >>>>>>>>>>>>>>> will >>>>>>>>>>>>>>> conflict? >>>>>>>>>>>>>>> >>>>>>>>>>>>>>> Rather >>>>>>>>>>>>>>> >>>>>>>>>>>>>>> >>>>>>>>>>>>>>> On Thursday, 16 August 2012 02:14:06 UTC+10, Sherbrow wrote: >>>>>>>>>>>>>>>> >>>>>>>>>>>>>>>> As said before, you should definitely not use formatting >>>>>>>>>>>>>>>> classes (like well - or you own styles) on scaffolding. >>>>>>>>>>>>>>>> The same for mixing spans and rows. The most obvious reason >>>>>>>>>>>>>>>> is that both those classes have different margin behavior, >>>>>>>>>>>>>>>> which creates >>>>>>>>>>>>>>>> paddings not supported by the grid. >>>>>>>>>>>>>>>> >>>>>>>>>>>>>>>> Here is an example of your first code, showing the >>>>>>>>>>>>>>>> differences (you can see that the 2nd col is actually a span4, >>>>>>>>>>>>>>>> which added >>>>>>>>>>>>>>>> to the span6 fills the span10) >>>>>>>>>>>>>>>> >>>>>>>>>>>>>>>> http://jsfiddle.net/Sherbrow/**p************ >>>>>>>>>>>>>>>> npUW/embedded/result/<http://jsfiddle.net/Sherbrow/pnpUW/embedded/result/> >>>>>>>>>>>>>>>> >>>>>>>>>>>>>>>> Ryan idea about giving classes to style the content instead >>>>>>>>>>>>>>>> of the spans is definitely a good practice. >>>>>>>>>>>>>>>> >>>>>>>>>>>>>>>> On Tuesday, August 14, 2012 12:20:50 PM UTC+2, Backspace >>>>>>>>>>>>>>>> wrote: >>>>>>>>>>>>>>>>> >>>>>>>>>>>>>>>>> Here is a pic to make it easier. Perhaps I need to use a >>>>>>>>>>>>>>>>> clear fix? >>>>>>>>>>>>>>>>> >>>>>>>>>>>>>>>>> >>>>>>>>>>>>>>>>> >>>>>>>>>>>>>>>>> On Tuesday, 14 August 2012 19:31:14 UTC+10, Backspace >>>>>>>>>>>>>>>>> wrote: >>>>>>>>>>>>>>>>>> >>>>>>>>>>>>>>>>>> Sorry if this is not clear, what I want to do. >>>>>>>>>>>>>>>>>> >>>>>>>>>>>>>>>>> >>>>>>>>>>>>>> >>>>>>>>>> >>>>>>>> >>>>> >>> >
