Hi All,
I want to use min-width and width for a class. Is that possible?
Can I use the following code :
.container
{
min-width:1000px;
width:100%;
height:100%;
overflow:hidden;
}
Thanks
Hi,
I have this HTML
<div class="someClass">
<ul>
<li><a href="index.html">1</a></li>
<li><a href="index.html">2</a></li>
<li><a href="index.html">3</a></li>
<li><a href="index.html">4</a></li>
<li><a href="index.html">5</a></li>
</ul>
</div>
Problem:
I want to make the <a>s to shape like a square, with height = 20px and width = 20px.
I can make it have the height and width if I make it float: left. In there the problem occur cause I need the <ul> to be centered but it won't because of the float:left of the <a>.
how can I make it centered with fix height and width of the anchors?
note: anchors don't have fixed length... the sample is just 5, but it can also grow to 7, or 9. I also need the links to be inline in view.
I want to change the standard "3D" look of the standard asp.net checkbox to say solid 1px. If I try to apply the styling to the Border for example it does just that - draws the standard checkbox with a border around it - which is valid I guess.
Anyway, is there a way to change how the actual textbox is styled?
I'm trying to create a page that allows a user to change the "look and feel" of the site. I would like to use something similar to jQuery's ThemeRoller or FireFox's Developer Tool.
I can't force the user to use Firefox and I don't need all the options that the ThemeRoller has. I'm really only looking for header, background, font size and font type.
Any suggestions?
Thanks
On my website http://nebkat.com/beta/index.php I added a sidebar. On the homepage there are two posts. The problem is that the second one always goes under the sidebar content. How do I move it up without using margins(example:margin-top: -50px)
Hello. I have several elements with already set fonts - like
<div style="font-size: 10px">
some text
</div>
<div style="font-size: 20p">
some text
</div>
I want to increment the font size proprtionally, eg
<div style="font-size: 15px">
..........................
<div style="font-size: 30px">
is that possible?
div {font-size: whatever} simply overwrites the values
I was playing with Infogrid on my site.
I added a header, a footer and added some text on the last block of iron man.
As you can see the footer doesn't show up and the text of the last block is cut off.
Now if you remove overflow:hidden; on the body, html the footer shows up but the text is still cut off.
Any idea on how this the footer could show up without the scrollbar (so overflow:hidden; has to stay) and how to get the text of the last block to show up entirely?
Thanks in advance and have fun :)
wadada
I am trying to get my bottom header to stick to the bottom of the screen inside of my iframe application and have it always appear in view for the user even when the page is scrolling. I have no control over the outer iframe as it is on a different domain. The header itself must be inside of the iframe as I have no control outside the iframe. The iframe always expands to the height of its contents so that it has no scrollbars, but the bar still has to be visible in the viewport at all times.
I have the following button:
<Club:RolloverButton runat="server" ValidationGroup="Login1" Text="Login" ID="LoginButton"
CommandName="Login" CssClass="links" />
.links {
display: block;
width: 96px;
padding: 2px 0px 2px 0px;
background: #A53602;
text-align: center;
text-transform: uppercase;
font-size: 10px;
color: #FFFFFF;
}
When this button shows up the first time it shows the style correctly, however if I hover my mouse over this button the layout turns into a standard button, why is that??
have a look at the top menu on these two pages on Firefox:
http://outsidemma.com/2010/100031-bj-penn-the-prodigy-jay-dee.php
http://outsidemma.com/index.php
On the first page for some reason there is some extra spacing above it.
This only happens on Firefox. I am using Firefox 3.6.
For the HTML List below, I need to add a background image only to the LI of the outer list.
(aka the one with class "menu-mlid-594 dhtml-menu expanded start-collapsed")
HTML codes are:
<li class="menu-mlid-594 dhtml-menu expanded start-collapsed ">About the Collection<ul class="menu"><li class="leaf first dhtml-menu ">By Theme</li><li class="leaf last dhtml-menu ">By Individual</li></ul></li>
How can I do that?
Thanks.
I am trying to create a site that has a fixed width content div and a floating div in the blank space on the right of the page, like so:
<html>
<div style="width:150px;float:right;border:thin black solid">
Lorem ipsum dolor sit amet, consectetuer adipiscing elit, sed diam nonummy nibh euismod tincidunt ut laoreet dolore magna aliquam erat volutpat. Ut wisi enim ad minim veniam.</div>
<div style="width:400px">
Lorem ipsum dolor sit amet, consectetuer adipiscing elit, sed diam nonummy nibh euismod tincidunt ut laoreet dolore magna aliquam erat volutpat.
Ut wisi enim ad minim veniam, quis nostrud exerci tation ullamcorper suscipit lobortis nisl ut aliquip ex ea commodo consequat. Duis autem vel eum iriure dolor in hendrerit in vulputate velit esse molestie consequat, vel illum dolore eu feugiat nulla facilisis at vero eros et accumsan et iusto odio dignissim qui blandit praesent luptatum zzril delenit augue duis dolore te feugait nulla facilisi.
</div>
</html>
This works fine, but when the page is re sized too small either the left div jumps down or the text within it does not start wrapping around the right div until its about halfway through it.
I would like the test within the left div to wrap around the float is the page width is too small.
What am I missing??
whats going on is everything is loading just fine url is deigned.sytes.net except for the links when i click about us or services or contact they look like there loading but the content in body.tpl doesn't change from default. maybe you can help me with this why the links are not changing. you u want here are the ONLY php files
I have made phps files for view perpose's but if you insist on it i will post the require code.
designed.sytes.net/index.phps
designed.sytes.net/classes/file.class.phps
<div id="navigation>
<ul class="navlist">
<li><img src="images/btn1.gif"/></li>
<li><img src="images/btn2.gif"/></li>
<li><img src="images/btn3.gif"/></li>
</ul>
</div>
How would I be able to give these "buttons" within the list rollover states without using JS? I'm totally drawing a blank...
These links must be images.
Hi,
I want to create unique styles for my links in a single particular div (So for example I want all links bold and red in the main body, but in the sidebardiv I want them blue and italic)
How do I go about it?
I have:
a:link{
color:#666666;
}
a:visited{
color:#003300;
}
a:hover{
color:#006600;
}
a:active{
color:#006600;
}
however if I put that in the sidebar div section it messes up my }'s
Hi,
i have this page.
login: [email protected]
password: m
As you can see in IE7 the selects for the age, and radio buttons are not well organized. In FF and IE8 no problem.
Any idea?
Regards
Javi
I was reading about rem units in CSS3, and was a little confused. If you use rem, do you still use em or does that replace it?
For example:
.selector {
margin-bottom:24px;
margin-bottom:2.4rem;
font-size:16px;
font-size:1.6rem;
}
or
.selector {
margin-bottom:24px;
margin-bottom:2.4em;
margin-bottom:2.4rem;
}
Just trying to figure out if rem takes the place of em, or if it's just another unit.
For testing
I don't want to upload css to FTP on each change till site complete , but site and content is online. (i'm not talking about saving page locally then apply css)
Can i just apply css locally to any online page.
it would be easier to edit and see changes locally till css work end.
and i want to see applied effect on FF and IE.
How to do that? Is it possible.
I have this wordpress blog that has many pages with subpages that dropdown on hover.... the thing is, I dont want the pages that you hover to link to anything unless they dont have any ul with many anchors inside so just the subpages will have a href different than "#"
So basically Im hacking my way through this with some simple javascript.
jQuery(document).ready(function(){
jQuery("#menus li > a").attr("href","#");
});
This is selecting every a.. and I dont want that... I just want the anchors that are main pages, not subpages... heres the html so maybe you can think of a better way to select this.
Ill explain first
the structure is
an ul with many li that have an anchor inside
if the li also has a ul inside then those are subpages that will appear on hover.
hence the initial anchor should have href="#"
if there is no ul inside the li then the li a should keep its href.
<ul id="menus">
<li>
<a href="somelink">Main Page</a> //href should be changed to #
<ul>
<li>
<a href="somelink2/">Subpage1</a>
</li>
<li>
<a href="somelink3">Subpage2</a>
</li>
</ul>
</li>
<li>
<a href="somelink">MainPage-with-no-subpages</a> //href should not be changed
</li>
<li>
<a href="somelink4">MainPage</a> //href should be changed to #
<ul>
<li>
<a href="somelink5">Subpage</a>
</li>
<li>
<a href="somelink6">Subpage</a>
</li>
</ul>
</li>
</ul>
Yo. There's a tendency in placing divs to follow each other vertically, but what i'm trying to accomplish right now is to is basically to place a number of divs (two) inside a parent div like so:
<div id='parent'><div id='onediv'></div> <div id='anotherone'></div> </div>
And i'd like to place 'anotherone' just to the right of 'onediv'. Sadly, float:right is pretty much ruining the layout with the divs popping out of their parent divs and whatnot. Any suggestions are welcome.
Edit: It might be worth noting that the parent div and 'anotherone' has no height elements at all, with 'onediv' planned to be thought as the "height support" div, allowing the contents of 'anotherone' to make the parent div larger at will.
So far I know, the conditional comments are only supported for different Versions of IE.
Likeways, can we provide conditional comments for other browsers too.
If Yes, How? If no, what could be the best alternative?
In the bottom cap of this page (bottom with corners) I seem to be having a weird IE6 issue. I've tried Google with no luck, as really, how do you ask this question.
In IE6, the corner images that are floated left and right seem to cause the whitespace to drop.
http://www.duncanhadleytriathlon.ca/
Any suggestions for why this may be?
Is there a way to make the scrollbar auto-hide when a user is not scrolling a webpage on an Android device, but make it visible when it is scrolling?
Please note that Firefox browsers does have this behaviour enabled by default, it's just Chrome and stock(Samsung, HTC) browsers that don't.
This is what I currently have:
-webkit-box-flex: 1;
width: 100%;
overflow: auto;
-webkit-overflow-scrolling: touch;
And I can always see the scrollbar on the list (except in ffox)