Options

Did SM do some coding changes?

2»

Comments

  • Options
    AndyAndy Registered Users Posts: 50,016 Major grins
    edited June 11, 2007
    BeachBill wrote:
    I just tried adding photos to a gallery for the first time since the "upgrade". Usability has taken a step backwards. What used to take one click now takes two.

    I don't have a problem if you just add this "new feature" to the home page, but when I'm in a specific gallery and I click "add photos", please let me just add photos to that gallery without having to wait for a downdrop and click again.
    Hi Bill, great feedback, thank you for this.
  • Options
    brandofamilybrandofamily Registered Users Posts: 2,013 Major grins
    edited June 11, 2007
    Mike Lane wrote:
    Have you even taken the time to check the page that he was having a problem with? Did you note the minute difference with and without that code?

    Mike, I think you checked the page AFTER I had added a "body" line to my CSS, thus getting things VERY close w/ or w/o the "new" SM coding...
    Originally the new line height had added up to creating approx 20px of new space at the bottom margin...
    All better now...
    Thanks
  • Options
    jh4wvujh4wvu Registered Users Posts: 169 Major grins
    edited June 11, 2007
    Thanks for the info; however, I am still confused. It looks fine in IE but not in FF. Is there a way to just reverse the change that was made to get it to look like it did?

    Also, it looks fine on the main site http://wvuband.org in both browsers, so whatever the change was I would like to be able to change it.

    I am still old fashioned and love to use tables. For some reason I am just more comfortable using them. Believe me I have tried messing with all CSS designed site and the frustration is not worth it.

    Thanks,
    Chris
    iamback wrote:
    I had a quick look and see that your header is constructed of nested tables with images placed on a background image (not the best of approaches but that's beside the point here). But images are inline content, and thus subject to line-height definitions in CSS.
    Now, I didn't test this, but you could try to set line-height (in your CSS) for those table cells and images that you are placing on top of the background to the exact number of pixels that you images/table cells are high and see if that helps. Also make sure you have defined no padding for the table cells, or the exact number of pixels you need for positioning the foreground images (that's another example of my "be specific" mantra).

    General note: combining sizes defined in pixels and in ems in the same dimension (horizontal, or vertical) can easily lead to layout problems because browsers need to calculate an actual size in pixels for those ems. Having everything in ems or everything in pixels circumvents rounding differences in browsers. And yes, you can define image sizes in ems, too - as long as you take care to be consistent - and they will even scale with text; but this works for foreground images only.
  • Options
    jh4wvujh4wvu Registered Users Posts: 169 Major grins
    edited June 11, 2007
    I was wondering if you could take a look at my site... http://gallery.wvuband.org

    I have written about my problems above in a couple of posts.

    Thanks,
    Chris
    {JT} wrote:
    Ok, for those of you following this thread there are a few things you should know. We will be sticking with the current YUI fonts css file, as well as adding a few more.

    This makes developing for the site using YUI lots easier, and provides a more consistent look and feel throughout the site.

    We will be adding YUI's reset and grids CSS files next, but this will be part of our next beta test, it will not be happening over night and you will get plenty of notice so you can ensure your customizations work.

    The reset.css file will create a level playing field for all browsers. Margins, padding, fonts, line height - eveyrthing should look as close to the same in each browser (this is a good thing).

    Again - we won't spring this on you overnight, you will have plenty of notice to use the beta server to preview things.

    I am sorry for any problems the fonts.css file has given anyone, if any of you need help with adjusting for the new code - please let me know and I can provide assistance.
  • Options
    iambackiamback Registered Users Posts: 288 Major grins
    edited June 11, 2007
    jh4wvu wrote:
    Thanks for the info; however, I am still confused. It looks fine in IE but not in FF.
    With the changes I suggested? Or without?
    jh4wvu wrote:
    Is there a way to just reverse the change that was made to get it to look like it did?
    Apparently not - looks like the new CSS is not only here to stay, but actually design-wise a lot better then whatever went before. So that means adapting to what we have now - but I'm sure adapting will be hard for many people, especially if there were a lot of customizations that were actually workarounds!
    jh4wvu wrote:
    I am still old fashioned and love to use tables. For some reason I am just more comfortable using them. Believe me I have tried messing with all CSS designed site and the frustration is not worth it.
    You might want to consider that designing without tables for layout will - if done well - result in smaller code. Search engines love that (your keyword density gets higher without adding any text!). Believe me, it is worth it, and once you get your head around it you won't want to go back.

    If you'd like help with that (or anyone reading this!), come over to the Desktop Publishing Forum (which not only covers DTP but web development and design as well): you'll find a medium-volume forum with a friendly crowd willing to help (including me).
    Marjolein Katsma
    Look through my eyes on Cultural Surfaces! - customizing... currently in a state between limbo and chaos
  • Options
    jh4wvujh4wvu Registered Users Posts: 169 Major grins
    edited June 11, 2007
    I have tried learning CSS design but haven't figured it out yet. Until then what can people do to get their designs looking like they were before the change?

    Thanks,
    Chris
    iamback wrote:
    jh4wvu wrote:
    Thanks for the info; however, I am still confused. It looks fine in IE but not in FF.
    With the changes I suggested? Or without?

    Apparently not - looks like the new CSS is not only here to stay, but actually design-wise a lot better then whatever went before. So that means adapting to what we have now - but I'm sure adapting will be hard for many people, especially if there were a lot of customizations that were actually workarounds!

    You might want to consider that designing without tables for layout will - if done well - result in smaller code. Search engines love that (your keyword density gets higher without adding any text!). Believe me, it is worth it, and once you get your head around it you won't want to go back.

    If you'd like help with that (or anyone reading this!), come over to the Desktop Publishing Forum (which not only covers DTP but web development and design as well): you'll find a medium-volume forum with a friendly crowd willing to help (including me).
  • Options
    jh4wvujh4wvu Registered Users Posts: 169 Major grins
    edited June 12, 2007
    Anyone know what I can do in the interim to fix my site so it looks right unitl I can learn more about CSS design.

    Thanks,
    Chris
    jh4wvu wrote:
    I have tried learning CSS design but haven't figured it out yet. Until then what can people do to get their designs looking like they were before the change?

    Thanks,
    Chris
    iamback wrote:
    jh4wvu wrote:
    Thanks for the info; however, I am still confused. It looks fine in IE but not in FF.
  • Options
    AllenAllen Registered Users Posts: 10,011 Major grins
    edited June 12, 2007
    jh4wvu wrote:
    Anyone know what I can do in the interim to fix my site so it looks right unitl I can learn more about CSS design.

    Thanks,
    Chris
    Looks fine here in Firefox and IE6, what do you need fixed?
    Al - Just a volunteer here having fun
    My Website index | My Blog
  • Options
    jh4wvujh4wvu Registered Users Posts: 169 Major grins
    edited June 12, 2007
    Here is what I am seeing...

    Screenshot_1.png

    and this is what it should look like....

    Screenshot_2.png
    Allen wrote:
    Looks fine here in Firefox and IE6, what do you need fixed?
  • Options
    iambackiamback Registered Users Posts: 288 Major grins
    edited June 12, 2007
    jh4wvu wrote:
    Here is what I am seeing...

    (...)

    and this is what it should look like....
    Have you tried my suggestions yet? It would help if we knew if you did in order to help you further.
    Marjolein Katsma
    Look through my eyes on Cultural Surfaces! - customizing... currently in a state between limbo and chaos
  • Options
    jh4wvujh4wvu Registered Users Posts: 169 Major grins
    edited June 12, 2007
    I have been playing with it all day and still can't figure it out. The bad thing is I was getting ready to switch this design out with another one and now it is causing me trouble as well. I had setup a test account to put everything together before switching out the designs (http://cdsimages.smugmug.com). Now I am back to square one. I really don't have time to fiddle with this when it worked a week ago with no problems.

    Please help.

    Thanks,
    Chris

    iamback wrote:
    Have you tried my suggestions yet? It would help if we knew if you did in order to help you further.
  • Options
    Mike LaneMike Lane Registered Users Posts: 7,106 Major grins
    edited June 13, 2007
    jh4wvu wrote:
    I have been playing with it all day and still can't figure it out. The bad thing is I was getting ready to switch this design out with another one and now it is causing me trouble as well. I had setup a test account to put everything together before switching out the designs (http://cdsimages.smugmug.com). Now I am back to square one. I really don't have time to fiddle with this when it worked a week ago with no problems.

    Please help.

    Thanks,
    Chris
    Take some time to learn about using layouts that do not require tables. They are sooooooooooo much easier than fussing with tables. We have a ton of resources right here on dgrin to help get you started. Also if you need hand-holding feel free to start your own thread and we'll get you sorted.
    Y'all don't want to hear me, you just want to dance.

    http://photos.mikelanestudios.com/
  • Options
    iambackiamback Registered Users Posts: 288 Major grins
    edited June 13, 2007
    jh4wvu wrote:
    I have been playing with it all day and still can't figure it out. The bad thing is I was getting ready to switch this design out with another one and now it is causing me trouble as well. I had setup a test account to put everything together before switching out the designs (http://cdsimages.smugmug.com). Now I am back to square one. I really don't have time to fiddle with this when it worked a week ago with no problems.
    OK then...

    First, I fully agree with what Mike Lane says, that it's much easier to design with stylesheets than fiddling about with tables. You really should learn. The offer stands, come over to the Desktop Publishing Forum and we'll help you get started. Free and friendly, just like here (and they're using vBulletin as well, albeit a newer version and configured a little differently).

    But I can see you're in a bind right now and telling you to learn (which you should) is not going to help you right now. And I like a challenge (when I have the time at least), so I'm taking pity on you. ;)

    So what did I do? I removed all "styling" from the table code except widths and heights. All styling goes into the stylesheet because that's much easier to tweak, and results in leaner code, too (good for SEO!).

    At least I haven't totally forgotten how to do layout with a table with images - the very first thing I noticed when looking at your code was that within table cells you had whitespace, notably newlines, before images. That's where that new line height comes in, because a new line is a line! And whitespace before an image in a table cell nearly always causes layout problems. So I removed all of that. The result was already much better, just doing that.

    Then I removed the paddings etc. From the table code. I also noted you're using three different image files (two of which are exactly identical to boot) for the "dot" separator in your little top-right menu; I reduced that to using only single one. (You can throw the other two away.) Then I tweaked the settings in the stylesheet, minimizing them, too (only for the part that relates to your banner, of course). Finally, I tweaked the sizes of the cells in the table code, and added an extra "spacer" cell to ensure the little menu top right lines up with the text on the image below it, and that the dots are centered between the menu elements.

    The result is this:

    CSS:
    body { background-color: #E0E0E0; background-image: url(http://www.wvuband.org/templates/frontpage2/images/background.gif); background-repeat: repeat-x; margin: 0; line-height: normal; }
    
    table { line-height: normal; }
    
    #Table_01 { border-collapse: collapse; border: none; margin: 0; }
    #Table_01 td { padding: 0; }
    #Table_01 tr.Table_01_top td { height:17px; text-align: center; }
    #Table_01 img { border: none }
    
    .mainlevel { margin-top: 2px; text-align: center; }
    .mainlevel a { color: white; text-decoration: none; font-size: 13px; font-family: Arial, Verdana, Helvetica, sans-serif; font-weight: bold; }
    .mainlevel a:hover { color: #e8bd00; }
    
    Note: there is no id "mainlevel" anywhere in your code, so you don't need a #mainlevel selector in your stylesheet.

    HTML:
    <div align="center">
        <table id="table_01" width="760" height="97">
    	<tr class="table_01_top">
    		<td></td>
    		<td colspan="2" rowspan="2" width="212"><!--spacer--></td>
    		<td width="64"><a href="http://www.wvu.edu/siteindex/"><img src="http://www.wvuband.org/templates/frontpage2/images/band_04.gif" alt="" width="64" height="17"></a></td>
    		<td width="21"><img src="http://www.wvuband.org/templates/frontpage2/images/band_05.gif" width="7" height="17" alt=""></td>
    		<td width="78"><a href="http://directory.wvu.edu/"><img src="http://www.wvuband.org/templates/frontpage2/images/band_06.gif" alt="" width="78" height="17"></a></td>
    		<td width="21"><img src="http://www.wvuband.org/templates/frontpage2/images/band_05.gif" width="7" height="17" alt=""></td>
    		<td width="49"><a href="http://wvuband.org/content/view/37/315/"><img src="http://www.wvuband.org/templates/frontpage2/images/band_08.gif" alt="" width="49" height="17"></a></td>
    		<td width="21"><img src="http://www.wvuband.org/templates/frontpage2/images/band_05.gif" width="7" height="17" alt=""></td>
    		<td width="51"><a href="http://www.wvu.edu"><img src="http://www.wvuband.org/templates/frontpage2/images/band_10.gif" alt="" width="51" height="17"></a></td>
    		<td width="9"><!--spacer--></td>
    	</tr>
    	<tr>
    		<td width="234"><a href="http://www.wvu.edu"><img src="http://www.wvuband.org/templates/frontpage2/images/band_11.gif" alt="" width="234" height="51"></a></td>
    		<td colspan="8" width="314"><img src="http://www.wvuband.org/templates/frontpage2/images/band_12.gif" width="314" height="51" alt=""></td>
    	</tr>
    	<tr>
    		<td colspan="11" height="29" class="mainlevel">
    			<a href="http://www.wvuband.org/component/option,com_frontpage/itemid,1/" class="mainlevel" id="active_menu">home</a><span class="mainlevel"> | </span><a href="http://www.wvuband.org/content/category/1/91/552/" class="mainlevel" >news</a><span class="mainlevel"> | </span><a href="http://www.wvuband.org/content/view/161/224/" class="mainlevel" >about the band</a><span class="mainlevel"> | </span><a href="http://www.wvuband.org/content/view/345/453/" class="mainlevel" >season information</a><span class="mainlevel"> | </span><a href="http://www.wvuband.org/content/view/163/227/" class="mainlevel" >multimedia</a><span class="mainlevel"> | </span><a href="http://www.wvuband.org/content/category/14/90/521/" class="mainlevel" >join us</a><span class="mainlevel"> | </span><a href="http://www.wvuband.org/component/option,com_weblinks/itemid,401/" class="mainlevel" >weblinks</a><span class="mainlevel"> | </span><a href="http://www.wvuband.org/content/view/387/491/" class="mainlevel" >band programs</a><span class="mainlevel"> | </span><a href="http://www.wvuband.org/content/view/37/315/" class="mainlevel" >contact us</a>
    		</td>
    	</tr>
    	</table>
    	</div>
    
    Note: this also restores the closing div you had commented out along with the previous version of your table code. And these are long lines, but that's OK - they'll wrap in the textarea in the customization form, but that's OK. Just keep the long lines as they are because they're designed to eliminate spurious whitespace.

    Now please do me a favor, and don't just plonk that into your code - study it and compare with yours, to see what I did, OK? (I did a little more than outlined above.)

    Done? Like it? Hate it?

    The next step would be to actually add relevant alt attributes to your images-of-text (i.e., the text that's in the images); for the dot, you could use alt="*". And pick one of them to function as your page heading (probably the big image on the right?) and wrap a h1 tag around it. That will help the bots. :)

    Disclaimer: I'm not starting a service to fix everyone's code! But if and when I have time, and think others might benefit from an example, I may bite.
    Marjolein Katsma
    Look through my eyes on Cultural Surfaces! - customizing... currently in a state between limbo and chaos
  • Options
    jh4wvujh4wvu Registered Users Posts: 169 Major grins
    edited June 13, 2007
    I appreciate your help....

    I have made these changes...plus a few tweaks and it still doesn't line up right in FF or Safari...and it doesn't match the design of the main site when you go back and forth... http://wvuband.org. I just checked it in IE..it looks lined up but doesn't match the original design.

    What are other people doing that don't know css design?

    My plan is to integrate the design from here (just the outer shell, header, and menu) - http://cdsimages.com/index.php and rebrand the smugmug site as my business.

    I am in the stages of trying to figure this out with these new changes. I trieds to take the elements you shared below and implement them but it is still not working out.

    I have also tried looking into css...but when doing so I am just not getting it. I will need more time.

    Is there anyway just to get it back to the way it was last week?

    Thanks,
    Chris
    iamback wrote:
    OK then...

    First, I fully agree with what Mike Lane says, that it's much easier to design with stylesheets than fiddling about with tables. You really should learn. The offer stands, come over to the Desktop Publishing Forum and we'll help you get started. Free and friendly, just like here (and they're using vBulletin as well, albeit a newer version and configured a little differently).

    But I can see you're in a bind right now and telling you to learn (which you should) is not going to help you right now. And I like a challenge (when I have the time at least), so I'm taking pity on you. ;)

    So what did I do? I removed all "styling" from the table code except widths and heights. All styling goes into the stylesheet because that's much easier to tweak, and results in leaner code, too (good for SEO!).

    At least I haven't totally forgotten how to do layout with a table with images - the very first thing I noticed when looking at your code was that within table cells you had whitespace, notably newlines, before images. That's where that new line height comes in, because a new line is a line! And whitespace before an image in a table cell nearly always causes layout problems. So I removed all of that. The result was already much better, just doing that.

    Then I removed the paddings etc. From the table code. I also noted you're using three different image files (two of which are exactly identical to boot) for the "dot" separator in your little top-right menu; I reduced that to using only single one. (You can throw the other two away.) Then I tweaked the settings in the stylesheet, minimizing them, too (only for the part that relates to your banner, of course). Finally, I tweaked the sizes of the cells in the table code, and added an extra "spacer" cell to ensure the little menu top right lines up with the text on the image below it, and that the dots are centered between the menu elements.

    The result is this:

    CSS:
    body { background-color: #E0E0E0; background-image: url(http://www.wvuband.org/templates/frontpage2/images/background.gif); background-repeat: repeat-x; margin: 0; line-height: normal; }
    
    table { line-height: normal; }
    
    #Table_01 { border-collapse: collapse; border: none; margin: 0; }
    #Table_01 td { padding: 0; }
    #Table_01 tr.Table_01_top td { height:17px; text-align: center; }
    #Table_01 img { border: none }
    
    .mainlevel { margin-top: 2px; text-align: center; }
    .mainlevel a { color: white; text-decoration: none; font-size: 13px; font-family: Arial, Verdana, Helvetica, sans-serif; font-weight: bold; }
    .mainlevel a:hover { color: #e8bd00; }
    
    Note: there is no id "mainlevel" anywhere in your code, so you don't need a #mainlevel selector in your stylesheet.

    HTML:
    <div align="center">
        <table id="table_01" width="760" height="97">
        <tr class="table_01_top">
            <td></td>
            <td colspan="2" rowspan="2" width="212"><!--spacer--></td>
            <td width="64"><a href="http://www.wvu.edu/siteindex/"><img src="http://www.wvuband.org/templates/frontpage2/images/band_04.gif" alt="" width="64" height="17"></a></td>
            <td width="21"><img src="http://www.wvuband.org/templates/frontpage2/images/band_05.gif" width="7" height="17" alt=""></td>
            <td width="78"><a href="http://directory.wvu.edu/"><img src="http://www.wvuband.org/templates/frontpage2/images/band_06.gif" alt="" width="78" height="17"></a></td>
            <td width="21"><img src="http://www.wvuband.org/templates/frontpage2/images/band_05.gif" width="7" height="17" alt=""></td>
            <td width="49"><a href="http://wvuband.org/content/view/37/315/"><img src="http://www.wvuband.org/templates/frontpage2/images/band_08.gif" alt="" width="49" height="17"></a></td>
            <td width="21"><img src="http://www.wvuband.org/templates/frontpage2/images/band_05.gif" width="7" height="17" alt=""></td>
            <td width="51"><a href="http://www.wvu.edu"><img src="http://www.wvuband.org/templates/frontpage2/images/band_10.gif" alt="" width="51" height="17"></a></td>
            <td width="9"><!--spacer--></td>
        </tr>
        <tr>
            <td width="234"><a href="http://www.wvu.edu"><img src="http://www.wvuband.org/templates/frontpage2/images/band_11.gif" alt="" width="234" height="51"></a></td>
            <td colspan="8" width="314"><img src="http://www.wvuband.org/templates/frontpage2/images/band_12.gif" width="314" height="51" alt=""></td>
        </tr>
        <tr>
            <td colspan="11" height="29" class="mainlevel">
                <a href="http://www.wvuband.org/component/option,com_frontpage/itemid,1/" class="mainlevel" id="active_menu">home</a><span class="mainlevel"> | </span><a href="http://www.wvuband.org/content/category/1/91/552/" class="mainlevel" >news</a><span class="mainlevel"> | </span><a href="http://www.wvuband.org/content/view/161/224/" class="mainlevel" >about the band</a><span class="mainlevel"> | </span><a href="http://www.wvuband.org/content/view/345/453/" class="mainlevel" >season information</a><span class="mainlevel"> | </span><a href="http://www.wvuband.org/content/view/163/227/" class="mainlevel" >multimedia</a><span class="mainlevel"> | </span><a href="http://www.wvuband.org/content/category/14/90/521/" class="mainlevel" >join us</a><span class="mainlevel"> | </span><a href="http://www.wvuband.org/component/option,com_weblinks/itemid,401/" class="mainlevel" >weblinks</a><span class="mainlevel"> | </span><a href="http://www.wvuband.org/content/view/387/491/" class="mainlevel" >band programs</a><span class="mainlevel"> | </span><a href="http://www.wvuband.org/content/view/37/315/" class="mainlevel" >contact us</a>
            </td>
        </tr>
        </table>
        </div>
    
    Note: this also restores the closing div you had commented out along with the previous version of your table code. And these are long lines, but that's OK - they'll wrap in the textarea in the customization form, but that's OK. Just keep the long lines as they are because they're designed to eliminate spurious whitespace.

    Now please do me a favor, and don't just plonk that into your code - study it and compare with yours, to see what I did, OK? (I did a little more than outlined above.)

    Done? Like it? Hate it?

    The next step would be to actually add relevant alt attributes to your images-of-text (i.e., the text that's in the images); for the dot, you could use alt="*". And pick one of them to function as your page heading (probably the big image on the right?) and wrap a h1 tag around it. That will help the bots. :)

    Disclaimer: I'm not starting a service to fix everyone's code! But if and when I have time, and think others might benefit from an example, I may bite.
  • Options
    Mike LaneMike Lane Registered Users Posts: 7,106 Major grins
    edited June 13, 2007
    jh4wvu wrote:
    What are other people doing that don't know css design?
    Learning CSS design mwink.gif
    Y'all don't want to hear me, you just want to dance.

    http://photos.mikelanestudios.com/
  • Options
    DavidTODavidTO Registered Users, Retired Mod Posts: 19,160 Major grins
    edited June 13, 2007
    Mike Lane wrote:
    Learning CSS design mwink.gif


    Some do hire out for this customization. Personally, I think you're better off learning it. It's not all that hard, really. There's TONS of support here to get your site customized, and when you're done, you'll know how to do it, and the more you do it the easier it gets.
    Moderator Emeritus
    Dgrin FAQ | Me | Workshops
  • Options
    iambackiamback Registered Users Posts: 288 Major grins
    edited June 13, 2007
    jh4wvu wrote:
    I appreciate your help....

    I have made these changes...plus a few tweaks and it still doesn't line up right in FF or Safari...and it doesn't match the design of the main site when you go back and forth... http://wvuband.org. I just checked it in IE..it looks lined up but doesn't match the original design.
    Well, I designed it checking in Firefox so I'm sure it lines up all right in that browser. And it's all defined in pixel sizes where before it wasn't, so it should be more consistent, too. Why don't you make a screenshot (again) of what it looks like now in Firefox, Safari and IE?

    On the other hand, yes, it's not exactly the same as it was - that's because I made sure the dots between the menu items at the top are now centered between those items - and they weren't before. Sure it's different. It's also typographically better.
    jh4wvu wrote:
    What are other people doing that don't know css design?
    What Mike lane said. mwink.gif And I already told you where you can get help besides here.
    jh4wvu wrote:
    I have also tried looking into css...but when doing so I am just not getting it. I will need more time.
    Or just some help getting over the initial hurdles. It's really not difficult.
    Is there anyway just to get it back to the way it was last week?
    Try putting back your code of last week, make sure yo udon't have any whitespace around image tags in your table cells (one whole td tag on a single line, content and all), and maybe (if still needed) what I showed you to set the line-height back to normal.

    But remember, the playing field has changed, and it's a bit bumpy to boot. In the customizations you do for a SmugMug site, your code is never completely independent from SmugMug's code, so if their code changes, you are likely to see changes, too, whether you change anything or not. There is nothing you can do to "undo" all of SmugMug's changes, you just have to adapt to them. And that means that in some cases it may be easier to start over for an element like a page header (and possibly end up with something better than you had!) than to endlessly try and tweak it (and possibly never be satisfied because it cannot be the same).

    Give it a little time, and see if you don't like my more typographical version better, after all.
    Marjolein Katsma
    Look through my eyes on Cultural Surfaces! - customizing... currently in a state between limbo and chaos
  • Options
    jh4wvujh4wvu Registered Users Posts: 169 Major grins
    edited June 14, 2007
    All I want is the design to look like it did last week. For some reason there are spaces that have been added the is changing the design...

    Take a look at http://cdsimages.smugmug.com. There is a space between the images across the top. Last week this was not there. I am trying to make it look like http://cdsimages.com

    I am also having problems with the design at http://gallery.wvuband.org..

    The header should look like the one at http://wvuband.org....again I don't understand why the design need to be in CSS in order to function with the changes that were made last week. I would think there could be css styles, etc that could be made to allow tables to still be used. I have tried to implement the changes mentioned in this thread but they don't seem to work out either.

    I am eventually moving the template I am using at
    http://cdsimages.com to replace the template at http://gallery.wvuband.org

    I don't understand why it changed all of a sudden and why I can't continue to use tables for my templates.

    Please advise.

    Thanks,

    Chris

    iamback wrote:
    Well, I designed it checking in Firefox so I'm sure it lines up all right in that browser. And it's all defined in pixel sizes where before it wasn't, so it should be more consistent, too. Why don't you make a screenshot (again) of what it looks like now in Firefox, Safari and IE?

    On the other hand, yes, it's not exactly the same as it was - that's because I made sure the dots between the menu items at the top are now centered between those items - and they weren't before. Sure it's different. It's also typographically better.

    What Mike lane said. mwink.gif And I already told you where you can get help besides here.

    Or just some help getting over the initial hurdles. It's really not difficult.

    Try putting back your code of last week, make sure yo udon't have any whitespace around image tags in your table cells (one whole td tag on a single line, content and all), and maybe (if still needed) what I showed you to set the line-height back to normal.

    But remember, the playing field has changed, and it's a bit bumpy to boot. In the customizations you do for a SmugMug site, your code is never completely independent from SmugMug's code, so if their code changes, you are likely to see changes, too, whether you change anything or not. There is nothing you can do to "undo" all of SmugMug's changes, you just have to adapt to them. And that means that in some cases it may be easier to start over for an element like a page header (and possibly end up with something better than you had!) than to endlessly try and tweak it (and possibly never be satisfied because it cannot be the same).

    Give it a little time, and see if you don't like my more typographical version better, after all.
  • Options
    iambackiamback Registered Users Posts: 288 Major grins
    edited June 16, 2007
    jh4wvu wrote:
    All I want is the design to look like it did last week. For some reason there are spaces that have been added the is changing the design...
    Now that you have put at least some of my code online I can also see a difference with what I was seeing locally when I wrote the code. The changes you made to the CSS part of that are irrelevant (unnecessary, I'll explain later), so somehow it must be SmugMug's stylesheets interfering...

    I'll have to run out now, but I'll get back to you later today, I have some ideas you might want to try.

    (You can use tables ... it's just not efficient (and not search-engine friendly), so it's certainly not advisable for your new design. For your current design though, it's not efficient to completely convert that to a CSS-based layout if you're going to a new design anyway - all you need there is some tweaks. We'll get them sorted out.)
    Marjolein Katsma
    Look through my eyes on Cultural Surfaces! - customizing... currently in a state between limbo and chaos
  • Options
    AndyAndy Registered Users Posts: 50,016 Major grins
    edited June 16, 2007
    jh4wvu wrote:
    All I want is the design to look like it did last week. For some reason there are spaces that have been added the is changing the design...

    Take a look at http://cdsimages.smugmug.com. There is a space between the images across the top. Last week this was not there. I am trying to make it look like http://cdsimages.com

    I am also having problems with the design at http://gallery.wvuband.org..

    The header should look like the one at http://wvuband.org....again I don't understand why the design need to be in CSS in order to function with the changes that were made last week. I would think there could be css styles, etc that could be made to allow tables to still be used. I have tried to implement the changes mentioned in this thread but they don't seem to work out either.

    I am eventually moving the template I am using at
    http://cdsimages.com to replace the template at http://gallery.wvuband.org

    I don't understand why it changed all of a sudden and why I can't continue to use tables for my templates.

    Please advise.

    Thanks,

    Chris
    Hi Chris, one of the best experts, Mike Lane, is out for a few days but he'll be back next week... if this isn't solved by then, I'm sure he can help.
Sign In or Register to comment.