|
CSS - Buufdesigns.com - Need Assistance
Hello!
I am currently fixing some issues with the BuufDesigns.com layout. But I am in need of assistance of some serious bugs I cannot fix in Internet Explorer and Firefox. Ironically, this website is compatible with Safari and Opera. This is a voluntary job, but you will be credited on the credit page. Not only that, but if anyone else knows how to intergrate ZenPhoto to my gallery, please PM me. Mind you, the Buufgallery and the ZenPhoto gallery default theme have very similar structure and attributes. Pretty much copying and pasting the php codes. But I can't seem to get that to function properly, hence needing a volunteer to help me on that. If you want this website released as soon as possible, someone please help me. I know there are some talented CSS designers here. But I can't seem to find a volunteer. Here are some teaser screenshots, if you want to help me with this little bug squashing project, you can see the whole development. URL Thanks! Similar TutorialsPlease look at this page - http://www.tmhdesign2.com See the nav bar with the green background and white font? I want that background to have an opacity of say 70% but when I do that the font also gets that opacity which is what I don't want. Hi, I am currently trying to postion an SWF menu on the top right corner of a DIV element, I am just starting with CSS and my brain has blanked out. I would greatly appreciate some HELP. Here is the link on the web= (ok I dont have permission to position a URL, please advise guys.) CSS body { background-color: #efefbe; } div#container { margin: 50px auto 0px auto; width: 1050px; height: 525px; } div#left { width: 525px; height: 525px; float: left; margin: 0px; } div#menu { width: 200px; height: 230px; position: absolute; top: 0; bottom: 0; left: 0; } div.content { width: 525px; height: 525px; background: white; float: left; margin: 0px; } p { font: 11px sans-serif; color: #666666; padding: 25px; } p#auto { overflow: auto; } Please look at this page - www.pacunionsonoma.com The issue I am trying to resolve is the positioning of the two links that read "Find a Realtor & FREE Property Evaluation". On IE7 I I have them where I want them. On FF they are too low. I outlined all relatively positioned elements and it seems in FF those links are sitting on teh very bottom of the container div while in IE they are slighly above the bottom of the containing div. ANy help? Thanks. Hey everyone. Well I am making a forum. And I need to use a margin-right for the main content(because I know of no other way to do it). They problem is, FireFox doesnt respond to the margin-right. Here is my (troubled) CSS. css Code: Original - css Code #main-content{ margin-left: 10px; width: 100%; }
#main-content{
And my XHTML. Code: <div id="main-content">Blahblahblah</div><!--Fairly simple :D--> I am using XHTML 1.0 Transitional. Ive tried to make the text float next to the image but when i try the text just sits below the div line under the image to the right. here is the URL: http://www.nevertap.com/s_media.php here is the markup: Code: <div id="center_top_content_header"> <h3>Event DVDs</h3> <div id="center_top_content"> <a href="http://www.nevertap.com/s_media_01.php"><img src="/i/cover_thmb.jpg" alt="Nevertap: Season 1" /></a> <div id="imagetext"> <p><span class="plusone bold">Nevertap Season 1 DVD, 5 hours of premium submission grappling! 19.99 Plus S&H</span></p> </div> <!-- END imagetext --> </div> <!-- END center_top_content --> </div> <!-- END center_top_content_header --> And here is the relavent CSS: Code:
div#center_window {
/* margin-top: 0px;*/
margin-left: 215px;
margin-right: 250px;
padding: 5px;
height: 100%;
/* border-left: 1px solid black; */
/* border-right: 1px solid black; */
/*border: 1px solid black; */
}
div#center_top_content_header {
width: auto;
margin: auto;
border: 1px solid black;
}
div#center_top_content {
padding: 0 10px 10px 10px;
width: auto;
margin: auto;
/*border: 1px solid black; */
}
div#imagetext {
float: right;
width: auto;
margin: auto;
padding: 0;
display: inline;
border: 1px solid black;
}
Please look at this layout as provided by my graphic designer: http://hometown.tmhdesign.com/default.jpg Now look at my attempt to achieve the same http://hometown.tmhdesign.com I am a bit challenged at the right column and how to lay it out. She put a fixed height gradient background in the right div and then placed yet another div on top of that one. THe issue as you can see is if the content on the left exceeds the content on the right the design breaks up (so to speak). I'm really curious to get some feedback from the experts... Website: www.devthor.net/sara/index.php CSS: www.devthor.net/sara/css/fineart.css Ok, here is the problem. It is a pretty basic site so I wasn't expecting many problems (well, maybe I should have, they always seem to crop up), and everything lays out properly except my menu bar. The goal is to have the text sit on top of the image, and the white bar that appears on mouse-over to appear on top of the image (preferably within 1 px accuracy so that the brown border still remains untouched by the opacity, picky, yeah, but I like the look better). So I was going to start playing with CSS hacks to get the positioning exactly right on all the browsers when I noticed something. Firefox on OS X and Firefox on a PC displayed the menu in a different location. I believe that this has to do with the default font sizes on the respective platform. But as a side effect, it messes up my absolute positioning efforts on the menu since the different sized text takes up different amounts of space. So I then attempted to go back to relative spacing since the font size would become a mute point if the page auto adjusts, however for some reason with the <dl><dd><dt><li> menu style I use, the text I place inside the menu div does not cause the div bounding box to expand. Thus relative positioning ends up placing the menu div inside the top image div. (More accurately it places the text from the menu div inside the image box while the actual div bounding box seems to have a height of 0, and thus is invisible. Basically I am looking preferable for a fix to the relative positioning issue. If a fix cannot be found for this, maybe just a fix for the font size messing up my layout issue. I am at the end of my means for figuring it out having spent the last 2 days searching for a solution. So any help would be tremendously appreciated. Thanks in advance, Devthor P.S. Sorry for the novel length post. I just figured some background as to what I have tried might be helpful. Please visit this page - http://www.brooksidetransmission.com Put your mouse over the "Services" link to reveal a sub menu. In FF it works fine in that you can access each of the links in the sub menu. In IE7 though when you move the mouse around the sub menu links the who sub menu disappears. Some background on this issue is that I am trying to incorporate two 3rd party resources into one, with one being the drop down menu, the other being a box with rounded corners. Somewhere in my combining the two messed up the :hover for IE7 Any help would be appreciated. Tom Hi, I am having some major problems making all the <div> tags place the content in the correct places. The logo (yes its poort quality on purpose, its just for testing ) needs to be centered and above the left and right vertical menus. The block of "Text" needs to be below the logo but contained between the two vertical menus. and the footer needs to be in line with the text but move up and down the page depending how much text is present. The site is: http://www.explosiveracing.net/test/header.html Could anyone be of assistance? Thanks Please look at this layout Layout Example In IE7 there is a gap between the footer and upper divs that I am not sure what is causing. The other issue I would appreciate help with is the #right div element. When the #content div has a higher height I want the #right div element to stretch with it (and vice versa). Any help would be appreciated. Tom I am having consistent alignment issues with IE7. I am uncertain as to what the issue could be. Any help, assistance or a link to some reference would be greatly appreciated. 1) . The line at the top of the screen and the tabs do not line up properly. The line transects the buttons. standardizedsupplements{dot}com 2) Image and Text are not aligned on same line: standardizedsupplements.com/tremorsure.html standardizedsupplements.com/purchase_tremorsure.html 3) Gif/Arrow to right side panel list ( <li> ) is not consistent showing up on all lists. standardizedsupplements.com/contact-us.html 4) In the FAQs, at the very top of the page, the numbers and the text overlap, when there are double digits. standardizedsupplements.com/faq.html |
|||||||