How to fix fieldset width

Question

I have a fieldset with an <a> tag as child. When I resize the child the fieldset's width changes as well even if I set a width property. However, the height doesn't change. I would like to know how to set a fixed width.

fieldset {
        float: right;
        margin-top: 40px;
        display: inline-block;
        vertical-align: top;
        height: 80px;
        width: 70px;
        text-align: center;
        overflow: hidden;
        border: 1px solid rgb(226, 226, 226);
        box-shadow: rgba(0, 0, 0, 0.1) 0px 1px 5px 0px, rgba(0, 0, 0, 0.15) 0px 4px 15px 0px;
}


a {
      background-color: red;
      border-color: rgb(212, 214, 216);
      border-width: 20px;
      box-shadow: rgb(212, 214, 216) 0.5px 0.5px 1px 0px;
      width: 50px;
}

.fa {
    padding: 5px;
    font-size: 15px;
    text-decoration: none;
    text-align: center;
    margin-left: 2px;
    transition: 0.3s;
    background: white;
    color: #303030;
    border: 10px solid red;
    border-radius: 5px;
    box-shadow: 0.5px 0.5px 0.5px 0px #d4d6d8;
}

<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/4.7.0/css/font-awesome.min.css">

<fieldset>
    <legend>Preview</legend>
    <a class="Preview"></a> 
</fieldset>

Are you changing the width of `a`? If so then nothing is happening (at least to me) since it's an inline element which doesn't have such properties as width and height. — Sergey, Jun 26 '18 at 20:09
Please include all relevant code from your fiddle in the question itself. Please don't make people go to another site just to answer your question. Also, your question is not terribly clear. You're already setting a fixed width in your CSS. — Heretic Monkey, Jun 26 '18 at 20:34
Width on a element is working fine. The point is I want to fix the width of the fieldset element. If I change the width on the a element or the padding or whatever that can affect the width, the fieldset width changes. — Inception, Jun 26 '18 at 21:05
Basically, I just want to have a fixed fieldset width. Nothing more, nothing less. Can you just open the fiddle and change the width of the a element and you'll see. — Inception, Jun 26 '18 at 21:07
If I change the width or the border-width of for instance. The fieldset doesn't keeps his width. — Inception, Jun 26 '18 at 21:16
https://stackoverflow.com/questions/2302495/is-there-any-way-to-have-a-fieldset-width-only-be-as-wide-as-the-controls-in-the#2302539 — connexo, Jun 26 '18 at 21:17
I saw that, but it doesn't seems to work. Here, the height is working as he should, but not the width. — Inception, Jun 26 '18 at 21:22

score 0 · Accepted Answer · answered Jul 16 '18 at 03:49

0

I found a solution.

Basically, I put the <a> into a <div> and I give the <div> a height and a width which is the same as the fieldset, then the size of the fieldset doesn't increase if I change the size of whatever is into the <div>

answered Jul 16 '18 at 03:49

Inception

57
1
8

How to fix fieldset width

1 Answers1