Forums

The forums ran from 2008-2020 and are now closed and viewable here as an archive.

Home Forums CSS Table outside the container

  • This topic is empty.
Viewing 13 posts - 1 through 13 (of 13 total)
  • Author
    Posts
  • #40947
    amazeballs
    Participant

    I am wanting a couple of links and a large phone number to go above the container, and range left and right. I want them to stay the width of the container but on window re-sizing they are floating off out into the background. How come? I set as a table, but still no joy what am I doing wrong (lots u may say!!! , no really, had a few flamings already but am willing to learn)

    [www.downthealleyandupthestairs.com…](http://www.downthealleyandupthestairs.com/ “Down The Alley and up the Stairs”)

    Also as still pretty green to web work, how come when specified the background still wont tile? Image large and blurry in safari & firefox but will show small in Dreamweaver design view. Have I got an over-riding rule somewhere?

    **MOD EDIT – CODE STRIPPED**

    #115228
    Paulie_D
    Member

    Simple answer. Don’t use a table.

    I’m on my phone at the moment but I’ll look at your code later.

    Could you stick it in Codepen in the meantime?

    #115240
    amazeballs
    Participant

    Think this is right place? http://codepen.io/anon/pen/orFeA
    Take a look :-)

    #115244
    Paulie_D
    Member

    In general, delete the table and put the content inside the container (as it’s already where you want it…in the middle).

    However, if you want it separate from the container then here’s the general idea.

    http://codepen.io/Paulie-D/pen/HDrqk

    #115473
    amazeballs
    Participant

    Cheers Paulie. Just a quickie. take a look at http://codepen.io/anon/full/Jgnjb I have the telephone number centred above the container ok, and now want the face book ‘like’ above the container ranged right to align with it. Should I make a new rule to do this? If so how do I get it to be the same width as the container, as it is a fluid layout so is all in %.
    Ps. any clue as to why the nav bar wont go full width?

    #115474
    Paulie_D
    Member

    I’m sorry…this could take a while.

    There’s so much extraneous stuff in your codepen that it will take some time to strip it out and see what is what.

    Also, any images you have linked to won’t show up because the are not on a webserver.

    #115482
    Paulie_D
    Member

    You have two divs , one with a class of ‘telephone’ and one with an id of #social. There is some malformed code in the social div so you might want to take a look at that. It should be…

    #115484
    Paulie_D
    Member

    I really think you should be looking to bring these inside your container since everything else is in there.

    It is going to be very difficult to maintain the telephone number in the center of the viewport AND have something aligned to it’s direct right on the same level. Margins just don’t really work that way.

    I’m not saying it’s impossible but it probably make more sense just to have your social div underneath the telephone number and centered as well.

    #115486
    Paulie_D
    Member

    As for your main navbar, I assume that this is the one just below the image?

    If so, the div DOES go fully across the page but I’m not sure you want the navbar full page width. Won’t this interfere with your sidebar?

    If you only want it to be the width of the content section then it make sense to either bring it inside that div or give it the same width.

    If you want the list items to be wider then you’ll have to give them greater widths or more padding. In fact, I wouldn’t set a width on the li, let their size be dictated by the ‘a’ links.

    #115496
    amazeballs
    Participant

    The Nav Bar is supposed to look like this : http://www.webstockbox.com/css/50-cool-css-menus-free-source-codes-tutorials/ (see example no 5) http://www.andrewsellick.com/examples/vista-menu/ So the buttons are a bit wider than they are now, ( will do what you suggested about the padding). But the nav bar goes the width above the side bar – or as you say will that do something nasty? As you can tell I am a newby but will at least I am learning from my mistakes as I ;-) Any tips or advise appreciated.

    #115499
    Paulie_D
    Member

    If the div with an id of ‘main-nav is supposed to go across the full page then you’re going to have to give it a height (which seems to be 29px) and set some sort of background image.

    You know…to be honest, we’re kind of working in the dark here…do you have an image of what the completed website is supposed to look like?

    If you don’t…you really should.

    #115752
    amazeballs
    Participant

    Hiya, I have a PDF showing the layout my friend wanted doing. Can I PM you with it? My nav bar now all the way across but the styling will show in live view on Dreamweaver but as soon as its in a Browser it drops it? Have a screen recording. Could you take a look?

    #115757
    Paulie_D
    Member

    I don’t have a problem with a PM. I may have to post an image here though to get more help. If that’s a problem then you might want to consider an alternative.

Viewing 13 posts - 1 through 13 (of 13 total)
  • The forum ‘CSS’ is closed to new topics and replies.