Re: [css-d] table layout to css conversion
I am converting this site http://www.rackemann.com/ from tables to css; and, I'm a little reluctant to go further without some feedback. The uri is: http://www.dlaakso.com/srb/ I think the site needs a color more reflective of a law firm. Grays or Browns usually work well. Additionally, red is a power color and can be integrated nicely as well. I think the three navigation menus are confusing (top horizontal, and the right two columns). As a site visitor, I'm not sure where to go. It's not that intuitive, I think. Personally, I think the old site is.. well, ugly. However, it is quite navigable (even though the navigation links are all images.. yuck). I think with a better color and navigation scheme, your new site will be leaps ahead of the old one. Good work, and best of luck. Connor Boyack WebVid Productions http://www.webvidpro.com/ __ css-discuss [EMAIL PROTECTED] http://www.css-discuss.org/mailman/listinfo/css-d IE7b2 testing hub -- http://css-discuss.incutio.com/?page=IE7 List wiki/FAQ -- http://css-discuss.incutio.com/ Supported by evolt.org -- http://www.evolt.org/help_support_evolt/
Re: [css-d] Hello new to list and with layout problem
I¹ve got an example here of what I¹ve done and now I¹m stuck. And I¹ve included a jpg of what I would like it to look like. Can it be done in css? Frankly I¹m having a hard time believing the hype about how good and useful css is supposed to be when I can¹t even do the simplest layout. I feel stupid. Can what I want be done and how would I go about it? Richard, You might try something like this. div style=clear:both; margin:5px 0;img src=image.jpg style=float:left; padding-right:10px; /Outlook Tutorial/div div style=clear:both; margin:5px 0;img src=image.jpg style=float:left; padding-right:10px; /Outlook Tutorial/div That should get you started. If you want the text to be a little lowered (and centered vertically next to the image) you might want to wrap it in its own div, giving it a margin-top of 5px or whatever looks best. Hope that helps. Connor Boyack WebVid Productions http://www.webvidpro.com/ __ css-discuss [EMAIL PROTECTED] http://www.css-discuss.org/mailman/listinfo/css-d IE7b2 testing hub -- http://css-discuss.incutio.com/?page=IE7 List wiki/FAQ -- http://css-discuss.incutio.com/ Supported by evolt.org -- http://www.evolt.org/help_support_evolt/
Re: [css-d] IE display problem(s)
I did
On 3/29/06, Holly Bergevin [EMAIL PROTECTED] wrote:
Have you tried changing the ie.css file as I suggested before? I'll
suggest it once more. The following selectors and declarations are the ONLY
things that should be in your ie.css file.
#leftnav ul {
margin-left:-5px;
left:30px;
margin-top:13px;
}
#content {
height: 350px;
overflow: visible;
}
Thanks for the feedback. I tried that, as you can see at:
http://www.connorboyack.com/junk/tlr/
In IE 6 it looks fine. In IE 5.5, I still had to include a hack to push the
content div over by 210 pixels - before, it was overlayed on top of the left
navigation.
However, in IE7b2, the overflow:visible; doesn't get caught for whatever
reason, and it doesn't expand vertically. Anybody know a fix for this?
Thanks,
Connor
--
Connor Boyack
WebVid Productions
http://www.webvidpro.com/
__
css-discuss [EMAIL PROTECTED]
http://www.css-discuss.org/mailman/listinfo/css-d
IE7b2 testing hub -- http://css-discuss.incutio.com/?page=IE7
List wiki/FAQ -- http://css-discuss.incutio.com/
Supported by evolt.org -- http://www.evolt.org/help_support_evolt/
Re: [css-d] IE display problem(s)
In IE, the min-height isn't recognized.. so on the index.html page, the footer is right up underneath it. How can I get hack the CSS to get IE to push the footer down a bit? Perhaps set a height? (By the way, your current index.html page does not look as you describe it above in my IE6.) Everything else I've fixed, but I'm still having the height issue. IE won't respond to the min-height property. If I set the height as 400px, for example, then it won't expand it greater than 400px - so if the content is longer, it gets chopped off. Does anybody know a hack to get IE to have a min-height? -- Connor Boyack WebVid Productions http://www.webvidpro.com/ __ css-discuss [EMAIL PROTECTED] http://www.css-discuss.org/mailman/listinfo/css-d IE7b2 testing hub -- http://css-discuss.incutio.com/?page=IE7 List wiki/FAQ -- http://css-discuss.incutio.com/ Supported by evolt.org -- http://www.evolt.org/help_support_evolt/
Re: [css-d] IE display problem(s)
Both pages are now valid XHTML and CSS. Anybody have any ideas? The links are: http://connorboyack.com/junk/tlr/index_short.html (page w/ short content) http://connorboyack.com/junk/tlr/index.html (page w/ long content) Thanks, Connor On 3/24/06, Ed Seehouse [EMAIL PROTECTED] wrote: On 3/24/06, Connor Boyack [EMAIL PROTECTED] wrote: So I just created a new mockup for a site, and when I went to view it in IE, I was quite amazed with how messed up the design was... I've spent some time trying to fix it, but have been rather unsuccessful in doing so. .. but in IE, it's totally busted! I'm not sure what the major culprit is in my CSS that is causing this, and I've been looking for a while. Well, the first thing is to get your xhtml code valid. The W3C validator a bunch of syntax errors in your code and it's pretty hard to diagnose a CSS problem when the xhtml isn't valid. In fact the CSS validator refused to check it because the xhtml is not valid. Invalid xhtml can do a lot of strange things to your layout. -- Ed Seedhouse __ css-discuss [EMAIL PROTECTED] http://www.css-discuss.org/mailman/listinfo/css-d IE7b2 testing hub -- http://css-discuss.incutio.com/?page=IE7 List wiki/FAQ -- http://css-discuss.incutio.com/ Supported by evolt.org -- http://www.evolt.org/help_support_evolt/ -- Connor Boyack WebVid Productions http://www.webvidpro.com/ __ css-discuss [EMAIL PROTECTED] http://www.css-discuss.org/mailman/listinfo/css-d IE7b2 testing hub -- http://css-discuss.incutio.com/?page=IE7 List wiki/FAQ -- http://css-discuss.incutio.com/ Supported by evolt.org -- http://www.evolt.org/help_support_evolt/
Re: [css-d] IE display problem(s)
Great, thanks for the tip.
I've changed that, and have a couple more bugs to squash...
In IE, the min-height isn't recognized.. so on the index.html page, the
footer is right up underneath it. How can I get hack the CSS to get IE to
push the footer down a bit? I don't want to do something like a
margin-bottom, I'm not sure that would work well.. maybe. Any ideas?
Also, in IE 7b2 (I have 5.5 and 7.. stupid installer for 7 overwrote 6..)
the div with the content on the right (#content) is getting pushed to the
right by 10-15 pixels or so, and I'm not sure why... and as you'll see, it
then pushes the entire webpage out to the right to compensate. Ugly. Any
thoughts?
Thanks for your help!
Connor
Links:
http://connorboyack.com/junk/tlr/index_short.html (page w/ short content)
http://connorboyack.com/junk/tlr/index.html (page w/ long content)
On 3/24/06, Holly Bergevin [EMAIL PROTECTED] wrote:
From: Connor Boyack [EMAIL PROTECTED]
Both pages are now valid XHTML and CSS. Anybody have any ideas?
The links are:
http://connorboyack.com/junk/tlr/index_short.html (page w/ short
content)
http://connorboyack.com/junk/tlr/index.html (page w/ long content)
Tested on the index.html page -
Start by getting rid of the following -
#leftnav, #content{ padding-bottom: 34277px; margin-bottom: -34267px; }
which is what is giving IE the willies. Then you can make further
adjustments from there, such as adding {position: relative;} to #leftnav and
getting rid of the following selectors in the ie.css -
#container { height:100%; overflow:visible; }
#subcontainer{ height:100%; overflow:visible;}
#container { margin:0px; padding:15px; width:750px;}
#leftnav ul li { padding:0; margin-left:-10px;}
#leftnav ul li a { font-size:11px;}
#content { float:right; }
These changes will give you a more common place to start visually between
FF and IE.
I hope that helps,
~holly
--
Connor Boyack
WebVid Productions
http://www.webvidpro.com/
__
css-discuss [EMAIL PROTECTED]
http://www.css-discuss.org/mailman/listinfo/css-d
IE7b2 testing hub -- http://css-discuss.incutio.com/?page=IE7
List wiki/FAQ -- http://css-discuss.incutio.com/
Supported by evolt.org -- http://www.evolt.org/help_support_evolt/
[css-d] z-index problem
Hello all, I'm a noob to this list, so I look forward to all and any help I might be able to receive. I am working on a site that can be seen at: http://www.connorboyack.com/magellan/ The problem I am having is that in IE, the menus appear below the content below. You'll see this especially when you hover your mouse over the last two menu items, you'll see the menu appear below the right-hand column. I've tried playing with z-index's but have been unsuccessful in getting this to work. Any help would be greatly appreciated! Thanks, Connor Boyack WebVid Productions http://www.webvidpro.com/ __ css-discuss [EMAIL PROTECTED] http://www.css-discuss.org/mailman/listinfo/css-d IE7b2 testing hub -- http://css-discuss.incutio.com/?page=IE7 List wiki/FAQ -- http://css-discuss.incutio.com/ Supported by evolt.org -- http://www.evolt.org/help_support_evolt/
Re: [css-d] z-index problem
I was experimenting somewhat with your covered IE-submenu, but now the link doesn't work anymore. My apologies! I was just now installing a new wireless router. The site is now working again :) Connor -- Connor Boyack WebVid Productions http://www.webvidpro.com/ __ css-discuss [EMAIL PROTECTED] http://www.css-discuss.org/mailman/listinfo/css-d IE7b2 testing hub -- http://css-discuss.incutio.com/?page=IE7 List wiki/FAQ -- http://css-discuss.incutio.com/ Supported by evolt.org -- http://www.evolt.org/help_support_evolt/
Re: [css-d] z-index problem
It seems in this way also the peekaboo doesn't appear (I turned the link to the ie-styles off, nothing turns wrong). :-) Hoorah! Thanks Francky, that fixed it. I really appreciate the prompt reply! Connor __ css-discuss [EMAIL PROTECTED] http://www.css-discuss.org/mailman/listinfo/css-d IE7b2 testing hub -- http://css-discuss.incutio.com/?page=IE7 List wiki/FAQ -- http://css-discuss.incutio.com/ Supported by evolt.org -- http://www.evolt.org/help_support_evolt/
Re: [css-d] More SOS issues
And using menu {line-height: 0) did the trick for the IE problem. However,
the submenus are showing up *under* the container in IE despite the fact
that #menu ul ul is set to a z-index of 500. I just read Francky's reply
to
Connor on this issue from earlier today but couldn't relate it directly to
my code
My main problem with the menus showing up underneath was the
position:relative I was applying to the menu's container. Francky removed
that container and did a workaround to get it to still work. However, my
fix isn't complete - it's now suffering from the IE peakaboo, which I have
yet to find a solid fix for - in IE it shows up okay at first but if you
scroll down a tad and then mouseover the menu, it'll jump up to the top -
see http://www.connorboyack.com/magellan2/
Connor.likesIE() != true;
--
Connor Boyack
WebVid Productions
http://www.webvidpro.com/
__
css-discuss [EMAIL PROTECTED]
http://www.css-discuss.org/mailman/listinfo/css-d
IE7b2 testing hub -- http://css-discuss.incutio.com/?page=IE7
List wiki/FAQ -- http://css-discuss.incutio.com/
Supported by evolt.org -- http://www.evolt.org/help_support_evolt/
Re: [css-d] z-index problem
Connor, Nothing to do with the reason you wrote, or CSS. And I mention it only because I viewed your page earlier today, and /feel/ the same, on a confirmation view this evening. If the menu is intentionally offset, that is all well and good. Nevertheless, I thought it was an error, and find it disrupts my equilibrium.http://dlaakso.com/mag.jpg. ~davidLaakso Yeah - I'm not the one who designed this page. The company hired a graphic designer to create the mockup, and my job is to just turn it into CSS/XHTML. I agree though, I'd rather see it on the left.. oh well :) Thanks for the notice, though. Connor -- Connor Boyack WebVid Productions http://www.webvidpro.com/ __ css-discuss [EMAIL PROTECTED] http://www.css-discuss.org/mailman/listinfo/css-d IE7b2 testing hub -- http://css-discuss.incutio.com/?page=IE7 List wiki/FAQ -- http://css-discuss.incutio.com/ Supported by evolt.org -- http://www.evolt.org/help_support_evolt/
