This Message Forum is no longer in use

Please use the new Bravenet Help Forums FOUND HERE

General Forum
This Forum is Locked
Author
Comment
tables alighned and positioning images

Hi,

I have never built a web page before and quite frankly with all the work involved I wish I hadn't started.

I want to include 5 more tables like the ones I have already on my site, the problem is they keep going on to the left hand side instead of 'centre' and 'right.' I realize this has something to do with 'align' but when I change the settings nothing happens.

I would really like the three already showing to be aligned from left to right, with my images in between.

Plus, I can't get my clock back into the top left either. Oops I nearly forgot, how can I place my affiliates exactly where I want them?

Thank you in advance

Jon

Re: tables alighned and positioning images

Yes, when you first start out, designing web pages can be very difficult. It looks like you started your page with the Website Wizard and then abandon it for the Visual editor. That's almost always a very bad idea. I wouldn't recommend the Visual editor for anything. It has too many idiosyncrasies. You might want to consider using a template from the template gallery and a different editor. Try this link to Kvetching About Templates. The page on template editing has links to several good editors and utilities. Although, making your tables fit horizontally will be even more challenging.

Making your tables appear side by side doesn't really have anything to do with "align". Tables are considered "block-level" elements. Generally, block-level elements begin on new lines. So each time you start a new table, a new line is generated and they stack vertically.

I think the latest HTML definitions contain the ability to declare a table as a "in-line" element, but only the newest of browsers will understand it, and you don't want to limit yourself to that.

To make the tables appear side by side, you need to contain them in another "block-level" element. A table within a table. At one place in your page you have a table within a table, but only one table is there so it doesn't change the display.

You start by creating a table with "N" empty horizontal cells. Where "N" is the number of objects that you want to display horizontally. Then, within each of those cells you add the table or image that you want to appear. Below is an example structure. Table cells center align it's content vertically, by default. That is the reason for the "valign" attribute. Remove it if you want everything to center align vertically.


  
    
    
    
    
    
    
  


If you have trouble, I can provide you with a complete example.

Re: tables alighned and positioning images

Thank you for your detailed reply. I will look up the information provided.

I skip a lot between visual and text editor. I really don't want to lose all my set up and info etc as it's took me quite a while (even lost everything on Saturday so started from scratch again)

I quite like my layout, if only I could get the three tables on the left to go directly left to right and then do the same underneath for the other five or six I want to add.

I didn't realize until today that my page looked different in IE (I use Firefox)

Thanks again

Re: tables alighned and positioning images

Can anyone help me with having three tables in the center of my page underneath the three images. Then two underneath the three with a blank square in the centre to write something and then three more underneath the square.

Thanks

Re: tables alighned and positioning images

I don't fully understand what your last post is asking for. I understand that you want the tables displayed horizontally, but I'm not sure what you want after that. Try this link to my test page to see if I'm on the right track. Then maybe you can elaborate on what else you want. I can the give you a link to a Zip file when it's finished.

You can view the source code by using your right mouse button. I don't have any comments in it yet, but I can add them if you don't understand how it's put together. I stripped out all of the "span" structures that were added by the Visual/Text editors. There were also lots of links with no selection point. I removed all the useless ones. All they did was confuse the issue. Between the "spans" and the useless links, I probably reduced the size by 50%.

Then I added a style sheet to make management a little easier and un-clutter the tables.

Re: tables alighned and positioning images

Absolutely perfect.

In my head it's the way you have done it. I just want to add three more tables, each with six links and then I wanted a box (rectangle) separating the top three from the bottom three (I have some image links to add in the rectangle and a paragraph or two, it's to do with the cycling organisations here in Norway)

I have read so many pages and looked at so many templates about aligning tables that I got to thinking of just packing it all in. It was meant as a bit of fun, a learning experience.

I see that you don't use '' is there a reason for that? I like the way it opens links on a new tab.

Your source code is extremely well laid out, thanks. Is it okay for me to take a copy and that way I can learn from it?

Very grateful - Is there a particular book/s ( I thought plural might be more appropriate to me) you would recommend I read.

Thank you

Jon

Re: tables alighned and positioning images

RE - last mail. I see you don't use

Re: tables alighned and positioning images

base target="main"

Re: tables alighned and positioning images

Let's start with this line.

I see that you don't use '' is there a reason for that? I like the way it opens links on a new tab.

There is no target attribute to enforce opening links in a new tab. That is strictly a function of your browser. If a visitor is using an older browser, or a new browser without tabbed browsing enabled, they simply get a new window. I have tabbed browsing enabled on Firefox, Internet Explorer, and Netscape. So if someone uses any "base target" that is intended to open a new window, it will open in a new tab.

You can use any name you please for the target, but there are a couple of named that are considered reserved, because they are intended to do specific things. The "base target" attribute is mainly used with frames based web sites. With frames based sites, you can associate names with each frame and then use the "target" attribute to specify which frame you want the link to open in.

It would be very difficult for me to recommend a good book. Probably 10 years ago I picked up a book that briefly described HTML. It was mainly about CGI applications but that was all I needed. To me, HTML reminded me of a markup language that I used in the past, on old PDP-11 computers running RSX-11M. It also helped to have 40 years of experience in programming.

But I did look around at a couple of books. I have an account on "www.books24x7.com", which brings up more than 60 books on HTML/CSS. At the top of the list was "HTML, XHTML & CSS for Dummies". I have never owned a "for Dummies" book, but looking through it, it seemed to be well written. It starts out with "The Least You Need to Know about HTML, CSS, and the Web". This approach doesn't overwhelm you with details when your just starting off. Amazon.com has it for on sale for $18.79. The "for Dummies" series also has several follow up books so you can expand your knowledge to JavaScript, PHP, and MySQL.

But, no matter what book you get, make sure it is directed towards CSS development. Designing with HTML and CSS allows you to separate your design structure from the content. It maked it easier to understand and manage.

There are also lots of on-line tutorials. Again, I don't use them very much, so I can't make a recommendation. Once I know the basics of a language, the details are easily available through a Google search. But possibly, someone else might recommend a good tutorial.

But back to your web site needs. I have updated the test page to include your added requirements. If you want to view the code on the web, without the advertisements cluttering it up, try the link to test page (no advertisements). I have also created a test page Zip file, that contains all of the code, plus a folder with images. I downloaded the images used on the page, because it easier to work with. I don't like to deal with remote images.

I have annotated the code with comments. Hopefully these should indicate to you what each section is for. You are welcome to use the code as you see fit.

Re: tables alighned and positioning images

A big thank you... If you want to add a link to your page or a certain site please feel free. Once I get my domain name and a couple of other things I would like to send you something.

Again, thanks.

Now I just have to study it all

Re: tables alighned and positioning images

Me again - I'm a little at a loss to see where I have gone wrong.

I deleted my previous site, used notebook to add my script and images and then uploaded it and installed it as my new site. I did use text editor but stayed away from visual.

Could you kindly inform me what went wrong?

Also, I changed four images in the centre under the first tables (the paragraph ending, everything one would like to know) changed the colspan, gave each a ratio but they won't go across the page.

Plus the colour "green" has disappeared and BOLD 'at the present' to the ending of 'internet from Norway'

Thanks for your help again if you decide too.

It's a slog but I'm learning and getting very close to the end.

Re: tables alighned and positioning images

you deleted your website/account

so nothing to even look at unless you made a typo

Re: tables alighned and positioning images

http://sykkelinfo.bravehost.com/

Re: tables alighned and positioning images

What happened to all of the code between the and tags?

The code I supplied included a style sheet named "bicycle.css". The style sheet contains the structural definitions. That file must be uploaded and linked in the head structure. The link code should look like the code below.

Re: tables alighned and positioning images

It's okay - I have it.

Re: tables alighned and positioning images

Thank you so much.....Nearly looking exactly how my head thinks it should look and I've learnt some things.