Or you could use.

 
Blackwater: Eddins, localhost = my computer, I can’t really show the webpage I’m working on, and that’s the whole code I have anyways

Heronemus: Eddins, if i also set a margin-bottom:-3px and margin-top:3px on the textbox, that reduces the jumpiness. if i set it to -6px for margin-bottom and 6px for margin-top on the textbox, then the button also stops jumping

Mcaulay: Eddins: thanks http://codepen.io/anon/pen/gaPJdj .How can I put the number before main heading h2 it is now on yop

Bridges: Anyone has had problems with transform rotate and perserve-3d when rendered in an iFrame on Safari iOS?

Moncus: Combinators are CSS3 features?

Hertzel: I mean, not of CSS1-2?

Fimbres: Descendant selector looks very CSS1

Brzuchalski: What do you mean by combinators?

Brzuchalski: Oh, yea, those have been thre since the beginning

Wealer: What about div + p and div ~ p?

Brzuchalski: I think one of them is, they are supported very well though

Medich: Morning all. is there a way to add a top margin to a div to bring it down 100px from the top without it making the page itself higher? As in, I’m trying to avoid having a scroll bar but need my header to be 100px from the top

Spiegler: I don’t get the utility of +; e.g. say I have this CSS: div + p {background-color: yellow;} and this html: divtest/div p1/p p2/p. 1 will have a yellow background, but I don’t get it. Is that all + does? it just selects one element?

Wilcut: Not sure if I am avoiding absolute positioning for the right reason though, I’m trying to keep this as a fluid layout, not sure if positioning header top:100px wtih a margin: auto would cause any problems

Brzuchalski: Net2014: it selects the p directly after the div

Staubs: Brzuchalski thanks, but that’s all + can do? all I can use it to other things in CSS?

Brzuchalski: Thats all its made to do, yep

Brzuchalski: Jax2: maybe try padding instead of margin?

Flam: I did try using padding, but the div was still at the top. Not sure why

Cheshire: It is inside of a container div that is width:100%; but no height specified, perhaps that’s why? Not sure.

Brzuchalski: Could you make a testcase?

Turnham: Brzuchalski, Preferred live pastebins: http://jsfiddle.net/http://codepen.io/http://paste.asmcbain.net/http://www.webdevout.net/test/

Domenick: Sigh. why does positioning have to be such a PITA . lol

Brzuchalski: Put an example of what youre trying to do in one of those

Mastropaolo: Brzuchalski, as there are no background images, it’s hard to tell what is what, but here is the link http://www.webdevout.net/test?0UX . I’m not sure if this site always has a scrollbar or not, so I’m not positive if it’s indicative of my problem.

Mccully: This wouldn’t be an issue normally, as most of the pages will normally go past the bottom of the window, but one or two will be short, so I’m trying to not have a scroll bar on those pages.

Brzuchalski: Jax2: so you want the outer container to touch the top of the page, but the inner container be moved down 100px?

Mckeown: Brzuchalski, basically yes. the inner container header needs to be 100px lower than the container full screen. The header is only 150px high

Morck: But adding a margin-top:100px, as I said, adds a scroll bar, so I’m ***uming it adds 100px to the bottom of the page as well

Gabbard: The issue is not with the header div, it is with the container div. The header is fine, it is 25px lower than the container. The container needs to be 75px lower than the top of the screen, but I do not want it adding those 75px to the bottom

Tealer: Which gives me 100px from top of screen to the top of the header div, as I needed . sorry, I confused myself a moment there

Brzuchalski: Well, theres two ways to do this

Bowline: Brzuchalski thanks, just saw your reply

Brzuchalski: You could use calc to calculate the height as 100% – 75px

Brzuchalski: Or you could use box-sizing: border-box, and give the body padding-top to push the container down