HTML + CSS Text container adjustment - html

I'm trying to get emulate this textbox container. But the thing is I am trying to adjust the height of the header, this part:
They provide all the files (html, css, js) of that page here
I've been searching through the documentation.css file for a while now to figure out where it is I can adjust the height of that box but I have been unsuccessful so far. This is what mine looks like:
As you can see mine looks almost exactly the same just the height of that box is too big. I'm fairly new to web programming so i might not be looking for the right thing in the right place so I'm hoping some more experienced eyes can figure it out.
Thanks for any help

The css is minified, what makes it a little more complex for beginers...
But if you search for .main-content>header in the file documentation.css you will notice it's setting up a padding.
The demo in the link you posted has:
padding:15px 30px;
In your code the first number is probably higher than 15, setting up a higher top/bottom padding. Just adjust it as you will.

Related

CSS: Scrollbar pushes my site-header, but not my css-inner, and it results in uneven widths

Just click any post to see what I mean, here's
I want to either:
1.make whole site pushable by scrollbar, so header and body have even widths
or
2.make whole site not pushable by scrollbar.
How can I do that? Maybe its because my header is 100% of width, while my body is fixed value (i think it is, dont remember).
Any help appreciated, ive been working on this website css for 2 weeks and my brain already wanted to give up
thanks #TheFrozenOne yeah that was it. i thought i added padding on post pages as well (and i did) but i added it to wrong div.
I fixed it already.
PS, sorry for not providing code.

White Blanks to the Right in Mobile View of Website

I'm debugging a website for a code written by somebody else. Typically I used bootstrap for responsive rows and columns but I believe this site is built on zurb-foundation.
Here is the url of the page. (www.edcast.com/privacy)
screenshot for a a visual of what i mean.
http://imgur.com/WTGDQTK
I will play around with this, but having a second eye and some other input would be highly appreciated!
Update: So far I've tried changing "overflow: visible" to hidden and auto
I've also tried to apply a clear: both to a variety of different divs
If you take a look at the image I posted below, you can see that the div with the id image-top-div is pushing everything over. You will need to resize the image and play with the margin and padding. You can see me here in the gif taking out the margin-left which solves it.

Outlook 2007 HTML Setting table width

I'm attempting to set a table width in a newsletter I am generating using HTML. I understand that CSS can't be used with Outlook and that styling basically needs to be included with content.
What I'm really struggling with is trying to set a set width for the table. Right now it is too wide and I'd like to trim it down. I'd like to move the width to the green line instead of the red line.
I've tried playing with the following code but no luck..
Any help would be appreciated!
You've probably got another row or element somewhere with a larger width than 150px that is overriding what you've got. I'd be happy to help you out if you post more of your HTML. I used to create a lot of HTML emails so I've had this happen in the past, and it's usually something you're not noticing that is overriding what you want.

Body goes off-canvas

I try to fix the layout, because if you see this link from you mobile you can see that the whole right part goes off canvas for some pixels.
I tried setting a max-width:1280px; attribute but it didnt work. Does anyone an easy fix?
Maybe I should define a body max-width ?
http://www.2kfilms.com/films.html
In your page and films-list styles you are defining fixed with. These will never be 'squeezed'. If you want them to get smaller somahow you need to define them differently. There may be more places in your code where you are doing that. Fix that to fit.

How To Align Body Content so it Aligns w/Header & Footer

I am building a website but I started with a template and gutted it, changed a lot and got rid of the entire center section and now I have to start over with the body but whenever I try to insert the navigation menu, which is a javascript code that is inserted from another program I used to build it. Well, every time I try to insert the menu on the left side of the page, it falls outside the alignment of the header and footer, so instead of it being straight aligned with the header and footer on the left side, it is on the outside of where it should be. I'm absolutely retarded when it comes to this stuff so if someone could tell me the trick here and for building the content of the body. Just simple stuff like what html code and tags to use for making the boxes that you can insert things into, not image placeholders but boxes to input content like navigation menu or anything really?
HELP PLEASE.
here is the site.
Retairacket.thexdt.com
I also get an invalid URL error.
By the sounds of your problem though, you should be able to fix it relatively quickly and easily. I assume from the sounds of it that your header and footer are a fixed width and that there is likely a fixed width block within the body that is forcing the body to be wider when you add in the (most likely) fixed width nav as well. If that's the case, then you will just need to change the way you are controlling the widths to suit the new nav bar. So reduce the width of one block to accomodate the width of the new one, make sense?
Remember, I haven't actually seen what the problem is, so I'm just guessing from your question here based on the most likely sceanario.
I would also recommend learning the basics first. Designing a website isn't as everyone makes it out to be. As an extreme beginner without using WYSIWYG editors, coding HTML can be very complex. There aren't just "tags to use for making the boxes that you can insert things into."
Yes, there are <p> and <div> tags that will do what you want, but you need to understand what each tag does and when to use it.
I recommend the following sites:
w3schools
HTML Goodies
Webmonkey
Search Google for "HTML basics"
That URL isn't valid, apparently.
I also can't see your page, but I can see http://www.thexdt.com. Is the design similar to that page?
That page uses tables for the general structure. Is there is a large image or something bigger that the width of the external container?