Hello and welcome to our community! Is this your first visit?
Register
Enjoy an ad free experience by logging in. Not a member yet? Register.
Results 1 to 11 of 11
  1. #1
    Regular Coder
    Join Date
    Aug 2009
    Posts
    411
    Thanks
    119
    Thanked 0 Times in 0 Posts

    repeating/editable regions or CSS?

    i'm going to have multiple product pages, and i want the same layout on each page, whereby the product headings appear in bold on the left. next to each heading is the product specific content. then in the upper right i want an image of the product with a View Larger link.

    is the best way to go about construction this sort of layout with a Table and making use of the repeating editable region functionality in dreamweaver, or should i be using CSS?

    if CSS, what's the overal gist of how i should set it up? i'm not really sure how i would get the headings in the left column to align right, then have the input/content right next to it, align left where they are and have everything line up.

    please advise. thanks!
    Attached Thumbnails Attached Thumbnails repeating/editable regions or CSS?-setup.jpg  

  • #2
    Master Coder
    Join Date
    Apr 2003
    Location
    in my house
    Posts
    5,211
    Thanks
    39
    Thanked 201 Times in 197 Posts
    this is one for css. I don't use dreamweaver so I can't comment on that part of your question.

    basically, it sounds like you want a three column table and for the cells in the left col, to be align:right with the cells in the middle column, align:left and the cells in the right column to be align:center;

    bazz
    "The day you stop learning is the day you become obsolete"! - my late Dad.

    Why do some people say "I don't know for sure"? If they don't know for sure then, they don't know!
    Useful MySQL resource
    Useful MySQL link

  • #3
    Regular Coder
    Join Date
    Aug 2009
    Posts
    411
    Thanks
    119
    Thanked 0 Times in 0 Posts
    well yeah, that's what i want. but how do i set it up with css? the problem is there's going to be a few cells/divs in the middle, which contain product descriptions, that are bigger for some products and smaller for others.

    so i dont know how i could possibly line up 3 divs next to eachother and have the headings in the very left div stay horizontally aligned with their descriptions in the next div.

    any advice? thanks.

  • #4
    Master Coder
    Join Date
    Apr 2003
    Location
    in my house
    Posts
    5,211
    Thanks
    39
    Thanked 201 Times in 197 Posts
    I would just use a table. I avoid them where possible but they are very OK for tabular data.

    Code:
    <table id='theTable'>
    <tr>
    <td class='left'></td>
    <td class='middle'></td>
    <td class='right'></td>
    </tr>
    <tr>
    <td class='left'></td>
    <td class='middle'></td>
    <td class'right'></td>
    </tr>
    <tr>
    <td></td>
    <td></td>
    <td></td>
    </tr>
    <table>
    css:
    Code:
    #theTable {
    border:1px solid #000;
    background:#fff;
    }
    #theTable td { /* applies attributes to all tds because the class ain't added*/
    width:150px;
    border:1px solid #ccc;
    }
    
    #theTable td.left{
    border:1px solid #ff8080;
    }
    view that in your page and post back when you want to learn more.

    bazz
    "The day you stop learning is the day you become obsolete"! - my late Dad.

    Why do some people say "I don't know for sure"? If they don't know for sure then, they don't know!
    Useful MySQL resource
    Useful MySQL link

  • Users who have thanked bazz for this post:

    sixrfan (11-06-2009)

  • #5
    Regular Coder
    Join Date
    Aug 2009
    Posts
    411
    Thanks
    119
    Thanked 0 Times in 0 Posts
    that's perfect. thank you!

  • #6
    Regular Coder
    Join Date
    Aug 2009
    Posts
    411
    Thanks
    119
    Thanked 0 Times in 0 Posts
    now if i want to put a UL and a few LIs within a certain cell (for instance, middle cell row 1 needs a list), how do i attribute CSS features to it? thanks!

  • #7
    Regular Coder
    Join Date
    Aug 2009
    Posts
    411
    Thanks
    119
    Thanked 0 Times in 0 Posts
    nevermind, i figured it out. need to put something like this in:

    Code:
    #prodtable ul {
    	margin: 0px;
    	padding: 0px;
    	background-color:#FF00FF;
    }
    #prodtable ul li {
    	list-style-type: none;
    }

  • #8
    Master Coder
    Join Date
    Apr 2003
    Location
    in my house
    Posts
    5,211
    Thanks
    39
    Thanked 201 Times in 197 Posts
    You could do that but watch for two things:

    1. if you have the following code at the top of your css, you shouldn;t need to re-declare the borders etc.
    Code:
    * {
    border:0;
    padding:0;
    margin:0;
    }
    2. is your data still tabular? if it is, you may not need to make a list or; if you do, maybe none of should be in a table?

    bazz
    "The day you stop learning is the day you become obsolete"! - my late Dad.

    Why do some people say "I don't know for sure"? If they don't know for sure then, they don't know!
    Useful MySQL resource
    Useful MySQL link

  • #9
    Regular Coder
    Join Date
    Aug 2009
    Posts
    411
    Thanks
    119
    Thanked 0 Times in 0 Posts
    ummm, now i'm a little confused.

    i do NOT have that code at the top of my css. what does that mean when there's an asterisk before the start of some css?

    what do you mean by data still tabular?

  • #10
    Master Coder
    Join Date
    Apr 2003
    Location
    in my house
    Posts
    5,211
    Thanks
    39
    Thanked 201 Times in 197 Posts
    the asterisk makes that css instruction apply to all browsers (that I know of) and helps with x-browser consistency/compatibility.

    with regard to tabular data; I was saying that what you initially described sounded like a table was correct. You seemed to want the data in each column to line up with the columns either side, which you weren't sure how to achieve with a series of divs. However, now you have mentioned including a list, within the table. That may be OK (coz I don't know the content) but, if it needs to align with data to its left (or right), it may not. I didn't mean that you should stop using a table. I just meant that you should ensure that your data is still correctly placed in a table, otherwise, reverting to a div idea might be semantically better.

    It's your site: it's your call.

    bazz
    "The day you stop learning is the day you become obsolete"! - my late Dad.

    Why do some people say "I don't know for sure"? If they don't know for sure then, they don't know!
    Useful MySQL resource
    Useful MySQL link

  • #11
    Master Coder Excavator's Avatar
    Join Date
    Dec 2006
    Location
    Alaska
    Posts
    9,740
    Thanks
    22
    Thanked 1,837 Times in 1,821 Posts
    Quote Originally Posted by sixrfan View Post
    ummm, now i'm a little confused.

    i do NOT have that code at the top of my css. what does that mean when there's an asterisk before the start of some css?
    The * is a leftover from the old DOS days. Means all or everything. Have a look at this - http://perishablepress.com/press/200...-reset-styles/
    Validate often DURING development - Use it like a splelchecker | Debug during Development |Write it for FireFox, ignore IE
    Use the right DocType | Validate your markup | Validate your CSS | Why validating is good | Why tables are bad


  •  

    Posting Permissions

    • You may not post new threads
    • You may not post replies
    • You may not post attachments
    • You may not edit your posts
    •