View Full Version : White bar above content field

Mr Robville
04-19-2011, 12:49 PM
hello all,
i have a little problem in dreamweaver, i'm following a tutorial to create a website. everything works fine, but as soon as i fill in something into the content field and preview it into the browser, a white bar appears above the content field (see image)
this isn't visible in dreamweaver.

i inserted a div tag with a editable region in it.

any help would be appreciated!


04-19-2011, 06:08 PM
Looks like unwanted margin or padding.

Have you used any CSS resets?

On the line of text personal message this will probably be a h1, h2 etc

Try applying in your css margin: 0; padding: 0; for this element.

If not i need to see more.

04-19-2011, 06:11 PM
Btw Dreamweaver's Design view is really to be used to select items and just to give you a general idea. Always preview in a browser.

Mr Robville
04-20-2011, 01:58 PM
the title text had a h2 applied, as soon as i removed it, the white bar dissapeared.
now i just gave the bit of text it's own settings without h2 applied on it.

is there a reason why this h2 or h1 creates a white bar?

thanks a lot!

04-20-2011, 02:51 PM
Yes, headers have margin/padding as a preset. If your text is a heading then, semantically, you'd be better off putting the h2 back and following Ricky's advice about the reset :)

04-20-2011, 03:05 PM
Oh yes don't remove the h2, just add either use a reset or set the margin and padding to 0 as explained above.

Mr Robville
04-20-2011, 03:51 PM
hmm, i gave a padding and a margin of 0 pix to the header, but the white bar still appears.

what do you mean exactly about a reset?
i'm sorry, i'm kind of new with this.

thanks for your help!

d a v e
04-20-2011, 05:53 PM
post a link to the page (upload it if it's not uploaded yet ;) )

Mr Robville
04-20-2011, 09:09 PM
it's www.mrrobville.com (http://www.mrrobville.com)
so far only the contact page has been added.

btw, one small off topic question, is there a easy way to make the menu bar fixed, but still centered? i want the background to adjust to the width of the window.
but as soon as you make the window smaller, all buttons stack up and the whole webpage get's out of shape.

04-21-2011, 05:57 AM
I don't see an h2 in your code?? Also you need to find another tutorial because this one is taking you down the wrong paths altogether. Tables are for tabular data, menus should be in lists and so on.

d a v e
04-21-2011, 06:54 AM
i don't see it - what browser AND version do you see it in?

also if i can my comments to what corrosive has mentioned - your header (and site) is very murky - far too dark and dirty. Can you read the text easily in your header? and your cubes look stretched too (ouch stretched cubes: see a doctor:) ) and you have a typo on your contact page: "idea's"

i think that you have 3 options:
1. learn how to make web pages and something about basic design principles before attempting your own page (see resources at bottom of my post)

2. use a wordpress - even the defaulot one and change the header and some of the colours to suit

3. pay someone (me? :) ) who knows what they are doing


http://net.tutsplus.com/tutorials/html-css-techniques/design-and-code-your-first -website-in-easy-to-understand-steps/

d a v e
04-21-2011, 07:59 AM
for ecample, it could look something like this

Mr Robville
04-21-2011, 02:25 PM
thanks for the offer, but i want to learn about making webpages myself.

the white bar above the content field is gone indeed because i haven't applied any header on that title,
but the same thing is happening at the bottom of the page, there is a white bar above the footer, and that text is still assigned to a header.

the cubes are meant to be a little tall compared to it's width, i think it looks a little interesting.

04-21-2011, 03:52 PM
Sorry, I'm probably being really dense but I don't see a gap anywhere on the page now. :confused:

Mr Robville
04-21-2011, 03:54 PM
it's here:

04-21-2011, 04:00 PM
I don't get that gap at all in Chrome. Looks like we are down to browser specifics. What browser and what OS are you using currently?

04-21-2011, 04:03 PM
I can't see the white either. I can see a pretty drab design though. You may want to reconsider paying someone.

Learning to build a site is one thing, learning how to design one is another thing entirely.

04-21-2011, 04:04 PM
Like Dave says a default WordPress job would be much better than this.

d a v e
04-21-2011, 04:06 PM
so again "i don't see it - what browser AND version do you see it in?"

04-21-2011, 04:07 PM
Nice design that Dave.

Also do you have to call the business Mr Robville ? doesn't sound much like a 3D modelling company to me. More like a pet minder or something.

Mr Robville
04-21-2011, 06:58 PM
i'm wondering if this discussion will stay on topic or if it goes to something else like i have to improve my "webdesign skills"
if i wanted someone to build a website for me i would have asked for it.
i know it isn't proffessional, maybe even far from it. but i have to learn things at some moment don't i?
my first 3d models were junk aswell.

it's not a company, it's just an website for my modelling projects.

i use Internet explorer and mozilla firefox on windows 7 home premium, both give me the white bar.

04-21-2011, 07:10 PM
It's already mentioned earlier in this thread, but if you use a CSS reset before any other css rules you won't struggle with this white space issues. Each browser has it's own CSS defaults, so if you zero them out you can build upon a clean sheet.

Here's one from Eric Meyer which you can copy and paste into your own stylesheet (at the top)

04-21-2011, 07:53 PM
i use Internet explorer and mozilla firefox on windows 7 home premium, both give me the white bar.

I checked in both those browsers, and I don't see any white gap.

d a v e
04-21-2011, 08:05 PM
just a thought - have you got your text size/zoom in your browser set as normal?

Mr Robville
04-21-2011, 08:41 PM
it's strange it appears only at my browsers,
the zoom is 100%, and i tried deleting the cookies and stuff aswell, but the white bar still exists.

i'll try adding a reset to see if that works,
thanks for the link!