|
CSS - Help! No Idea How To Fix This....
Ok here is my problem:
.leftmenu { font-family:Verdana,Helvetica,Arial,sans-serif; font-size:12px; color:#444444; text-decoration:underline; } .leftmenu:link,.leftmenu:visited { font-family:Verdana,Helvetica,Arial,sans-serif; font-size:12px; color:#FFFFFF; text-decoration:underline; } .leftmenu:hover,.leftmenu:active { font-family:Verdana,Helvetica,Arial,sans-serif; font-size:12px; color:#F22222; text-decoration:underline; } I already have an a:link ect section (which works) However, i want to call the leftmenu class from the start of a table insert. <td width="70px" background="img/topbar.gif" class="leftmenu"> the leftmenu class itself works for text, BUT it doesnt get applied to links. Is there anyway to do this short of coding it into each link? I know css but have never tried anything like this before, and its been wrecking my head all morning..... B Similar TutorialsThanks for reading, I have no idea what I'm doing as far as CSS goes and I just purchased this code for a bigcartel store. My main issue is that when I click checkout button with something in the cart nothing is happening. This is the checkout page code.where is says ---- is where my site goes but this is my first post so I cant post with it in there. <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "(----)"> <html xmlns="(----)"> <head> <title>{{ store.name }} — One moment...</title> <style type="text/css"> body { margin: 100px; text-align: center; font-family: Arial, Helvetica, sans-serif; color: #666; } h3 { padding: 50px; border: solid 1px #ddd; background-color: #f8f8f8; width: 300px; font-size: 18px; } </style> <script type="text/javascript" charset="utf-8"> function checkout() { if(top != self) { top.location.replace(self.location.href); } else { document.checkout_form.submit(); } } </script> {{ head_content}} </head> <body onload="checkout();"> <div align="center" style="margin:20px;"> <h3>One moment...</h3> </div> {% checkoutform %} <noscript> <input type="submit" value="Checkout" /> </noscript> {% endcheckoutform %} </body> </html> Anyone see anything wrong with it? The checkout button is supposed to take your paypal account so you can pay for the t-shirts. Here's the actual site add the www and com to it naffleskell.bigcartel Any help is greatly appreciated. Thank you!! Ok, this may be asking too much, but I have this design idea - http://tmh.netdbs.com/turnkey2.jpg But insofar as laying it out with CSS, I just am not sure where to begin breaking it apart and creating various divs so to speak, the main white area is where I will lay out various <P> tags and won't have a problem with that, but it is getting started that challenges me. I'd appreciate some feedback on how to approach this. TOm I've been trying to figure out how I can use css to make one side of the body one color and the other side another color. For example: if I want the entire left 70% of the page to be white and the right 30% to be black. no margins. it needs to stretch the entire length of the page regardless if there's any content in a div or not. And it need to be fluid. I've been trying everything I know and apparently that's not very much because I can't figure it out. The link below is what I've tried using a bg image. Hopefull this will illustrate the idea. But I don't want to use a bg image if I don't have to plus the division where the color changes needs to be fluid with the text and I haven't figured out how to do it with the offset percentages. Basically the left side needs to be white as wide or wider as the left column and the right side color can go from that point all th eway right regardless of how wide the browser is. Does that make sense? I think I could do it if it were 50/50 but that's not what I'm after. http://sonicparke.com Has anybody done this or know how it should be done? I haven't figured out how to align the <div> tag to be center for the Mozilla browser.. I know I'm missing something here but I can't remember which. This one work in IE but not Mozilla. Code:
<div style="text-align: center;">
<div>
<STYLE TYPE="text/css">
body {font-family:Verdana;
font-size:10pt;
font-weight:normal;
color:black;}
H2 {font-family:Verdana;
font-size:12pt;
font-weight:bold;
color:black;
width: 625px;
BORDER-BOTTOM: black 1px solid;
}
TD {font-family:Verdana;
font-size:8pt;
font-weight:normal;
color:black;}
.cTradeLines TD
{FONT-WEIGHT: normal;
FONT-SIZE:10ptl;
COLOR: black;
FONT-FAMILY: Arial}
.cTradeLines A
{FONT-WEIGHT: normal;
FONT-SIZE:10pt;
FONT-FAMILY: Arial}
.cTradeLines A:hover
{FONT-WEIGHT: normal;
FONT-SIZE:10pt;
FONT-FAMILY: Arial}
.cSpSm
{FONT-WEIGHT: normal;
FONT-SIZE: 7pt;
COLOR: black;
FONT-FAMILY: Arial}
</STYLE>
<p>
<table border="0" cellpadding="0" cellspacing="0" >
<tr>
<td width="50%"></td>
<td width="50%" align="right" style="font-size:10pt;" valign="top"><LABEL style="font-family:Verdana; font-size:12pt; font-weight:bold; color:black;">TRANS UNION Credit Profile Report</LABEL><br>TRANS UNION<br>555 W ADAMS<br>CHICAGO, IL. 60661<br>800 888-4213<br>
Date Reported: 9/16/2005</td>
</tr>
</table>
</p>
<p>
<table border="0" cellpadding="0" cellspacing="0" >
<tr>
<td width="50%"></td>
<td width="50%" align="right" style="font-size:10pt;" valign="top"></td>
</tr>
</table>
</p>
<p>
<H2>Status</H2>
No Hit<br></p>
</div>
</div>
I know the codes isn't w3.org compliant with the way the <style> tag are inserted. It's the way the web page is created via the 3rd party website when receiving it and I'm encapsulating it with a <div> tag. I don't wanna do a lot of screen scraping and moving around the tags with PHP because they are never the same from the 3rd party website. Thanks.. for my website, i'm going to be using some css for every page in it, would it be advisable to store the css for each page in their own file? or even better in the actual page itself? if i put it all into one css file i'll end up putting bit spacers: /*-=-=-=-=-=-=---=-=-=-=-=-=-=-=-=-=-=-=--=-=-=-=-*/ to block things apart Actually I had 4 files named the same as they were importing: Code: CSS @import "header.css"; @import "menu.css"; @import "content.css"; @import "footer.css"; It took me a half hour to figure out why IE was loading and Firefox wasn't. Hahaha, I am dumb. D-U-M-B, I mean D-U-N-C-E Off to the corner with me... Picture What if someone only had two middle fingers? Would they raise both and then go piss on their shoe? GEOGRAPHY :P I'm bored, at least I'm getting paid for this post :P Hahahaha... Quoted from a recent post " Using a server-side language or JavaScript to send different stylesheets to different browsers is a bad practice. It tends to cause more problems than it solves. " Enlighten me on "why this is considered a bad practice " -- or even better yet, what would u suggest is a work around. Specifically ive found that the use of absolute positioning tends to vary on how it works ( or doesn't) , ive narrowed my specific problem down to what seems to be the different browser's assigning a different "meter value" ( for lack of a better term) or size increment for "1px" My test page is essentially "displaying correctly" except offset values seem to produce a varying range of "what 1px really means". IE6 (win) and FF1/2 (win) displays the test page fine - but on IE5.2(mac), Safari (not sure version, but oddly enough this browser gives the closest true values) , and FF1 (mac) seem to "define 1px as either larger or smaller" then whatever their windows counterpart decides. How would you suggest I work around this situation if not with Browser Dection via the use of serverSide / Javascript coding ( which until reading the quoted statement above, i was going to implement). Do Share please ! edit: heres the CSS file, its been validated. The issue is inspecific to my file but related to browser detection. anyway... Code:
#totalcontents {
z-index : 7;
position : relative;
}
.banner {
z-index : 6;
position : absolute;
top : -1px;
z-index : 3;
}
#introblock {
position : relative;
}
.navigation {
z-index : 10;
position : absolute;
top : -33px;
left : 200px;
}
.smallheadline {
z-index: 8;
position : absolute;
top : -43px;
left : -175px;
width : 395px;
color : #CCFF00;
background-color : #333300;
padding : 3px;
border-style : solid;
border-width : 1px;
border-color : #999966;
font-family : times;
font-size : 10pt;
}
.dropright {
z-index: 8;
position : absolute;
top : -67px;
padding : 7px;
left : 203px;
color : #CCFF00;
border-style : solid;
border-width : 1px;
border-color : #66FF00;
background-color : #333300;
width : 325px;
}
.othernews {
z-index : 5;
position : absolute;
top : -276px;
left : -175px;
width : 390px;
color : #FFFFFF;
padding : 5px;
/*border-style : solid;
border-width : 1px;
border-color : #CCFF00;*/
}
.backdrop {
z-index : -1;
position : absolute;
top : -635px;
}
html {
background-color : #646464;
}
|
|||||||